beforeEach钩子,next('/login') 跳转问题,无线循环导致Maximum call stack size exceeded问题

好久没写vue了,今天突然犯了一个致命的小错误,代码如下:

routes.beforeEach((to, from, next) => {
  if (sessionStorage.getItem('token')) {
    next();
  } else {
    next('/login');
  }
});

貌似一看没问题,但是却陷入了死循环,最后导致栈溢出。

原因:没有排除当前地址,就是/login地址,导致了循环调用。

解决如下:

routes.beforeEach((to, from, next) => {
  if (sessionStorage.getItem('token')) {
    next();
  } else {
    //如果是登录页面路径,就直接next()
    if (to.path === '/login') {
      next();
    } else {
      next('/login');
    }
  }
});

判断如果是登录页就放行,这样就不会死循环了。

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值