vue 设置路由的登录权限的方法

风景优美的黄山景区,一年四季游人如织。蜀僧抱绿绮,西下峨眉峰。为我一挥手,如听万壑松。客心洗流水,馀响入霜钟。不觉碧山暮,秋云暗几重。

index.js

将需要登录权限的路由设置meta属性

meta:{requireAuth:true}, 

main.js

在main.js内直接写对路由的验证

router.beforeEach((to, from, next) => {
  if (to.matched.some(record => record.meta.requireAuth)){ // 判断该路由是否需要登录权限
    if (sessionStorage.getItem("access_token")) { // 判断当前的token是否存在
      next();
    }
    else {
      next({
      path: '/manage',
      query: {redirect: to.fullPath} // 将跳转的路由path作为参数,登录成功后跳转到该路由
    })
    }
  }
  else {
    next();
  }
});

总结

以上所述是小编给大家介绍的vue 设置路由的登录权限的方法,希望对大家有所帮助,如果大家有任何疑问请给我留言,小编会及时回复大家的。在此也非常感谢大家对网站的支持!

本文vue 设置路由的登录权限的方法到此结束。当你能梦的时候就不好放下梦。小编再次感谢大家对我们的支持!

您可能有感兴趣的文章
Vue路由参数的传递与获取方式详细介绍

vue学习记录之动态组件浅析

vue如何实现列表固定列滚动

vue如何实现伸缩菜单功能

vue项目中canvas如何实现截图功能