Question

我有这样的代码：

created: function() {
    if(!localStorage.hasOwnProperty('auth_token')) {
        router.replace({name: 'login'});
    } else {
         if(router.history.current.name == 'login') {
             router.push({name: 'allVideos'});
         }
    }
}

在我的Vue根实例中。

因此，当页面加载时，它会检查令牌。当我没有令牌时，我会重定向到登录页面。如果我在登录页面上有一个令牌重定向到allVideos，或者如果在其他页面上没有重定向。

当我刷新，通过一些按钮等时，一切正常。但是当我手动输入/＃/ login并按下输入Vue渲染登录页面但auth_token存在。当我手动输入时，根本不会使用created方法。当我再次从登录页面再次输入/＃/ login时，它开始工作....任何想法???感谢

更新：我尝试使用导航警卫

router.beforeEach((to, from, next) => {
    if(localStorage.hasOwnProperty('auth_token')) {
        if(to.name == 'login') {
            next({name: 'allVideos'});
        }
    } else {
        if(to.name != 'login') {
            next({path: '/login'});
        }
    }
        next();

});

现在代码对我来说更加清晰，但是当我手动打字时问题仍然存在

Answer 1

在您的代码中，next()被调用2次，因此会产生问题。您可以尝试以下代码：

router.beforeEach((to, from, next) => {
  if(localStorage.hasOwnProperty('auth_token')) {
    if(to.name === 'login') {
      next({name: 'allVideos'});
    }
  } else if(to.name !== 'login') {
    next({path: '/login'})
  } else {
    next();
  }
});

手动键入时，Vue2路由器不起作用

1 个答案: