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 格式化时间日期函数小结
Mar 20 Javascript
jquery+json 通用三级联动下拉列表
Apr 19 Javascript
理解Javascript_05_原型继承原理
Oct 13 Javascript
jquery如何获取复选框的值
Dec 12 Javascript
AngularJS实现Model缓存的方式
Feb 03 Javascript
文本框只能输入数字的js代码(含小数点)
Jul 10 Javascript
基于Node的React图片上传组件实现实例代码
May 10 Javascript
vue better scroll 无法滚动的解决方法
Jun 07 Javascript
vue2使用keep-alive缓存多层列表页的方法
Sep 21 Javascript
JS 设计模式之:工厂模式定义与实现方法浅析
May 06 Javascript
简单了解常用的JavaScript 库
Jul 16 Javascript
vue中提示$index is not defined错误的解决方式
Sep 02 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
CodeIgniter开发实现支付宝接口调用的方法示例
2016/11/14 PHP
3分钟写出来的Jquery版checkbox全选反选功能
2013/10/23 Javascript
js判断浏览器类型为ie6时不执行
2014/06/15 Javascript
javascript实现在某个元素上阻止鼠标右键事件的方法和实例
2014/08/12 Javascript
基于jQuery实现复选框的全选 全不选 反选功能
2014/11/24 Javascript
使用jQuery不判断浏览器高度解决iframe自适应高度问题
2014/12/16 Javascript
jQuery实现的精美平滑二级下拉菜单效果代码
2016/03/28 Javascript
AngularJS在IE8的不支持的解决方法
2016/05/13 Javascript
Highcharts学习之坐标轴
2016/08/02 Javascript
Vuejs实现带样式的单文件组件新方法
2017/05/02 Javascript
使用 jQuery 实现表单验证功能
2017/07/05 jQuery
详解VUE中常用的几种import(模块、文件)引入方式
2018/07/03 Javascript
微信小程序实现登录遮罩效果
2018/11/01 Javascript
JavaScript基础之静态方法和实例方法分析
2018/12/26 Javascript
node创建Vue项目步骤详解
2020/03/06 Javascript
Vuex中的Mutations的具体使用方法
2020/06/01 Javascript
vue如何搭建多页面多系统应用
2020/06/17 Javascript
小程序实现tab标签页
2020/11/16 Javascript
基于ajax实现上传图片代码示例解析
2020/12/03 Javascript
[34:08]2018DOTA2亚洲邀请赛3月29日 小组赛B组 VP VS EG
2018/03/30 DOTA
[01:59]翻天覆地,因你而变,7.20版本地图更新速览
2018/11/24 DOTA
[01:10:03]OG vs EG 2018国际邀请赛淘汰赛BO3 第三场 8.23
2018/08/24 DOTA
数据挖掘之Apriori算法详解和Python实现代码分享
2014/11/07 Python
Python 基础教程之str和repr的详解
2017/08/20 Python
TensorFlow模型保存/载入的两种方法
2018/03/08 Python
Python3实现计算两个数组的交集算法示例
2019/04/03 Python
Python绘图Matplotlib之坐标轴及刻度总结
2019/06/28 Python
就业表自我评价分享
2014/02/06 职场文书
关爱留守儿童标语
2014/06/18 职场文书
作风建设年活动总结
2014/08/27 职场文书
教师学习群众路线心得体会
2014/11/04 职场文书
欢迎词范文
2015/01/27 职场文书
活动费用申请报告
2015/05/15 职场文书
当幸福来敲门观后感
2015/06/01 职场文书
2016春季运动会通讯稿
2015/07/18 职场文书
MySQL详细讲解变量variables的用法
2022/06/21 MySQL