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 相关文章推荐
jquery中使用$(#form).submit()重写提交表单无效原因分析及解决
Mar 25 Javascript
基于jQuery和CSS3制作数字时钟附源码下载(jquery篇)
Nov 24 Javascript
JavaScript实现字符串与日期的互相转换及日期的格式化
Mar 07 Javascript
jQuery对checkbox 复选框的全选全不选反选的操作
Aug 09 Javascript
Vue开发过程中遇到的疑惑知识点总结
Jan 20 Javascript
js以及jquery实现手风琴效果
Apr 17 Javascript
JS实现的自动打字效果示例
Mar 10 Javascript
angularjs select 赋值 ng-options配置方法
Feb 28 Javascript
Vue 页面状态保持页面间数据传输的一种方法(推荐)
Nov 01 Javascript
vue使用svg文件补充-svg放大缩小操作(使用d3.js)
Sep 22 Javascript
JS闭包原理及其使用场景解析
Dec 03 Javascript
详解前端任务构建利器Gulp.js使用指南
Apr 30 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/06/13 PHP
Thinkphp5.0框架的Db操作实例分析【连接、增删改查、链式操作等】
2019/10/11 PHP
jQuery 学习 几种常用方法
2009/06/11 Javascript
Jquery实现简单的动画效果代码
2012/03/18 Javascript
javascript 另一种图片滚动切换效果思路
2012/04/20 Javascript
Javascript计算两个marker之间的距离(Google Map V3)
2013/04/26 Javascript
js获取html页面节点方法(递归方式)
2013/12/13 Javascript
JS中类或对象的定义说明
2014/03/10 Javascript
JavaScript返回0-1之间随机数的方法
2015/04/06 Javascript
jquery实现叠层3D文字特效代码分享
2015/08/21 Javascript
多种JQuery循环滚动文字图片效果代码
2020/06/23 Javascript
Javascript 实现全屏滚动实例代码
2016/12/31 Javascript
浅谈原生JS实现jQuery的animate()动画示例
2017/03/08 Javascript
JavaScript实现一个空中避难的小游戏
2017/06/06 Javascript
微信小程序搜索组件wxSearch实例详解
2017/06/08 Javascript
React Native基础入门之调试React Native应用的一小步
2018/07/02 Javascript
vue input输入框关键字筛选检索列表数据展示
2020/10/26 Javascript
JS实现打砖块游戏
2020/02/14 Javascript
JavaScript find()方法及返回数据实例
2020/04/30 Javascript
微信小程序学习总结(三)条件、模板、文件引用实例分析
2020/06/04 Javascript
[46:43]DOTA2上海特级锦标赛D组小组赛#1 EG VS COL第三局
2016/02/28 DOTA
python实现简单socket通信的方法
2016/04/19 Python
答题辅助python代码实现
2018/01/16 Python
python分数表示方式和写法
2019/06/26 Python
django 实现手动存储文件到model的FileField
2020/03/30 Python
如何使用python切换hosts文件
2020/04/29 Python
html+js 实现markdown编辑器效果
2019/10/23 HTML / CSS
泰海淘:泰国king Power王权免税集团旗下跨境海淘综合型电商
2020/07/26 全球购物
.net面试题
2016/09/17 面试题
LINUX下线程,GDI类的解释
2016/12/14 面试题
工业学校毕业生自荐书
2014/01/03 职场文书
幼儿园大班评语大全
2014/04/17 职场文书
禁毒宣传工作方案
2014/05/23 职场文书
党的群众路线教育实践活动教师自我剖析材料
2014/10/09 职场文书
深度学习详解之初试机器学习
2021/04/14 Python
Spring Data JPA框架Repository自定义实现
2022/04/28 Java/Android