我有一个简单的路由保护与firebase身份验证,但它不能正常工作。
下面的代码不会呈现任何内容,也不会显示任何控制台错误。
所以,我现在没有在我的应用程序中实现任何auth系统,所以,它假设重定向到/ auth route并显示Auth.vue内容,但它没有显示任何内容,只是一个空白页面。
有关如何解决它的任何想法?
Auth.vue
<template>
<div class="auth">
<h1>Auth</h1>
</div>
</template>
Home.vue
<template>
<div class="home">
<h1>Home</h1>
</div>
</template>
router.js
import Vue from 'vue'
import Router from 'vue-router'
import Home from './views/Home.vue'
import Auth from './views/Auth.vue'
import firebase from 'firebase/app'
import 'firebase/auth'
Vue.use(Router)
let router = new Router({
routes: [
{
path: '/',
name: 'home',
component: Home,
meta: {
auth: true
}
},
{
path: '/auth',
name: 'auth',
component: Auth
}
]
});
router.beforeEach((to, from, next) => {
if (to.matched.some(record => record.meta.auth)) {
firebase.auth().onAuthStateChanged(function(user) {
if (!user) {
next('/auth');
} else {
next();
}
});
} else {
next();
}
});
export default router
尝试
if(!user)
{
next({
path: '/auth'
})
}
代替
if (!user) {
next('/auth');
}