Vue路由器beforeEach在使用next（）时陷入死循环

Question

我遇到了这个问题，我不能使用next('/login')。这是我的代码：

*/ all imports that are needed 

Vue.use(Router); 

const routes = [ 
{path: '/', component: Home}, 
{path: '/admin', component: Admin}, 
{path: '/login', component: Login}] 

var route = new Router({ 
routes: routes, 
mode: 'history' }); 

route.beforeEach((to, from , next) => { 
console.log(to.fullPath) 
next('/login'); 
}); 

new Vue({ 
    el: '#app', 
    router: route, 
    template: '<App/>', 
    components: { 
    App 
    } 
}) 

它工作时，我只用next（）的，但是当我给next（）函数的路线它把一个无限循环

console screenshot

Answer 1

你必须内如果您已经指向'/login'，请阻止拨打next('/login')。

例如：

route.beforeEach((to, from , next) => { 
    console.log(to.fullPath) 
    if (to.path !== '/login') { 
    next('/login'); 
    } else { 
    next(); 
    } 
});