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(); 
    } 
});