[Vue.js]router.beforeEach做登陆验证

在做一个登陆功能的时候遇到的一个小问题。需求是用户没有登录的时候打开其他页面都是跳转到登录页面,登陆之后则可以正常使用。查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();
    }
});

然后就正常了~

最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容

  • Android 自定义View的各种姿势1 Activity的显示之ViewRootImpl详解 Activity...
    passiontim阅读 174,138评论 25 709
  • 摘要:今日巴菲特伯克希尔哈撒韦2017股东大会如期举行,会议中巴菲特强烈建议不懂股票的人购买标普500ETF。 一...
    Darren_Lin阅读 660评论 0 2
  • 小确幸这个词很多人可能比较陌生,它出自树上春树的随笔,被翻译成了现代汉语,即小确幸这个词。 小确幸...
    53fe4e8bddb6阅读 1,597评论 5 12
  • 符合直觉:保证设计能引导用户做出最符合直觉的操作; 差异化的创新特征:设计中要有显著的创新特征,即让用户感觉到某些...
    snowdoem阅读 397评论 0 1
  • Day 43:今天和儿子一起看魔女宅急便开始第一章和第二章。很有意思的小故事,讲述一个小魔女只学会了飞行将要离家开...
    晨光微晓阅读 201评论 0 0