在做一个登陆功能的时候遇到的一个小问题。需求是用户没有登录的时候打开其他页面都是跳转到登录页面,登陆之后则可以正常使用。查vue-router的文档,发现使用beforeEach可以实现功能,于是尝试着写了一下:
router.beforeEach((to, from, next) => {
// 模拟登陆状态
let isLogin = false;
if (!isLogin) {
next({path: '/login'});
}else {
next();
}
});
发现报错:
报错大概意思是溢出了,也就是说每次到next又会再次进入beforeEach,所以进入了死循环。
改造如下:
router.beforeEach((to, from, next) => {
// 模拟登陆状态
let isLogin = false;
if (!isLogin) {
if (to.path !== '/login') {
return next({path: '/login'});
}else {
next();
}
}else {
if (to.path === '/login') {
return next({path: '/'});
}
next();
}
});
然后就正常了~
网友评论