vue路由守卫死循环和路由守卫使用

当前业务要求：
通过判断本地sessionstorge判断当前是否需要登陆页面

问题场景：用户登陆进入页面内部，点击退出登录，清除本地用户信息，页面跳转至登陆页面，使用浏览器的回退可以正常返回至项目内部。需要改成：停留在登陆页面。

解决方式：使用vue的路由守卫

router.beforeEach((to, from, next) => {

  let token = sessionStorage.getItem("currentUser");
  if (token) {
    next();
  } else {
    if (to.path == "/login") {
      next();
    } else {
      next({ path: "/login" });
    }
  }
});

按照正常逻辑处理：获取token，判断token，如果有token正常处理，没有token直接跳转login页面。但是会出现死循环。
出现原因：每次跳转时都会触发全局守卫，但是判断的条件没有变，所以一直循环。

beforeEach传参解释：
to：即将进入的目标
from：当前导航正要离开的路由

可以返回的值：

1. false：取消当前的导航。如果浏览器的 URL 改变了(可能是用户手动或者浏览器后退按钮)，那么 URL 地址会重置到 from 路由对应的地址。
2. 一个路由地址: 通过一个路由地址跳转到一个不同的地址，就像你调用 router.push() 一样，你可以设置诸如 replace: true 或 name: ‘home’ 之类的配置。当前的导航被中断，然后进行一个新的导航，就和 from 一样。

看到vue-router官网也有说明出现死循环的代码：

这篇好文章是转载于：学新通技术网