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


Posted in Javascript onJuly 03, 2018

index.js

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

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

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 设置路由的登录权限的方法,希望对大家有所帮助,如果大家有任何疑问请给我留言,小编会及时回复大家的。在此也非常感谢大家对三水点靠木网站的支持!

Javascript 相关文章推荐
js获取div高度的代码
Aug 09 Javascript
jquery插件实现鼠标经过图片右侧显示大图的效果(类似淘宝)
Feb 04 Javascript
JQuery对class属性的操作实现按钮开关效果
Oct 11 Javascript
JQuery插件ajaxfileupload.js异步上传文件实例
May 19 Javascript
JS实现合并两个数组并去除重复项只留一个的方法
Dec 17 Javascript
原生JS实现旋转木马式图片轮播插件
Apr 25 Javascript
基于jQuery实现文字打印动态效果
Apr 21 jQuery
react router4+redux实现路由权限控制的方法
May 03 Javascript
JS同步、异步、延迟加载的方法
May 05 Javascript
vue2.0 获取从http接口中获取数据,组件开发,路由配置方式
Nov 04 Javascript
压缩Vue.js打包后的体积方法总结(Vue.js打包后体积过大问题)
Feb 03 Javascript
javascript History对象原理解析
Feb 17 Javascript
jQuery阻止事件冒泡实例分析
Jul 03 #jQuery
详解VUE中常用的几种import(模块、文件)引入方式
Jul 03 #Javascript
Vue props用法详解(小结)
Jul 03 #Javascript
JavaScript设计模式之代理模式简单实例教程
Jul 03 #Javascript
详解Vue中使用Echarts的两种方式
Jul 03 #Javascript
vue awesome swiper异步加载数据出现的bug问题
Jul 03 #Javascript
JavaScript设计模式之工厂模式简单实例教程
Jul 03 #Javascript
You might like
php 生成自动创建文件夹并上传文件的示例代码
2014/03/07 PHP
PHP实现查询两个数组中不同元素的方法
2016/02/23 PHP
jquery时间下拉框小例子
2013/04/15 Javascript
ExtJS判断IE浏览器类型的方法
2014/02/10 Javascript
JavaScript关闭当前页面(窗口)不带任何提示
2014/03/26 Javascript
jquery缓动swing liner控制动画过程不同时刻的速度
2014/05/29 Javascript
js获取浏览器基本信息大全
2014/11/27 Javascript
生成二维码方法汇总
2014/12/26 Javascript
jQuery实现不断闪烁文字的方法
2015/05/15 Javascript
Javascript简单实现面向对象编程继承实例代码
2015/11/27 Javascript
基于jquery实现ajax无刷新评论
2020/08/19 Javascript
利用原生JS自动生成文章标题树的实例
2016/08/22 Javascript
vue指令以及dom操作详解
2017/03/04 Javascript
自定义类似于jQuery UI Selectable 的Vue指令v-selectable
2017/08/23 jQuery
详解ES6中的 Set Map 数据结构学习总结
2018/11/06 Javascript
详解VUE里子组件如何获取父组件动态变化的值
2018/12/26 Javascript
Vue-CLI 项目在pycharm中配置方法
2019/08/30 Javascript
vue-cli2与vue-cli3在一台电脑共存的实现方法
2019/09/25 Javascript
使用konva和vue-konva库实现拖拽滑块验证功能
2020/04/27 Javascript
浅谈在vue-cli3项目中解决动态引入图片img404的问题
2020/08/04 Javascript
[02:04]2016国际邀请赛中国区预选赛VG.R晋级之路
2016/07/01 DOTA
virtualenv 指定 python 解释器的版本方法
2018/10/25 Python
python3读取图片并灰度化图片的四种方法(OpenCV、PIL.Image、TensorFlow方法)总结
2019/07/04 Python
Python 、Pycharm、Anaconda三者的区别与联系、安装过程及注意事项
2019/10/11 Python
详解使用Python下载文件的几种方法
2019/10/13 Python
给 TensorFlow 变量进行赋值的方式
2020/02/10 Python
android面试问题与答案
2016/12/27 面试题
播音主持女孩的自我评价分享
2013/11/20 职场文书
4s店总经理岗位职责
2013/12/31 职场文书
数学系毕业生的自我评价
2014/01/10 职场文书
事业单位辞职信范文
2014/01/19 职场文书
个人充满哲理的自我评价
2014/02/20 职场文书
《悯农》教学反思
2014/04/28 职场文书
银行奉献演讲稿
2014/09/16 职场文书
鲁迅故里导游词
2015/02/05 职场文书
大学毕业生自我鉴定范文
2019/06/21 职场文书