在addroutes后,$router.options.routes没有更新的问题(手摸手,带你用vue撸后台 读后感)
参照《着手摸手,带你用vue撸后台》一文,本人做了前端的权限判断
https://segmentfault.com/a/1190000009275424
首先就是在addroutes后,$router.options.routes不会更新。因为本人的侧面导航栏是使用$router.options.routes来遍历生成的。于是就发现这个问题。
作者估计这个是个bug,已经提交issuse:https://github.com/vuejs/vue-router/issues/1859
说一下解决方法:
1、在addroutes前,使用router.options.routes=XXXXX的方法手动添加
2、使用作者的方法,在store里维护一个routes对象,然后使用这个对象遍历生成侧面导航栏
补充一个作者没有说,但是源代码里做了的小细节:
这个系统再切换用户时,路由不会动态更新。所以需要在登出函数中加上location.reload();刷新浏览器。
在addroutes后,$router.options.routes没有更新的问题(手摸手,带你用vue撸后台 读后感)的更多相关文章
- [React] React Router: Nested Routes
Since react-router routes are components, creating nested routes is as simple as making one route a ...
- [Angular2 Router] Auxiliary Routes bit by bit
Article Github Auxiliary Routes is is little bit hard to understand. Here is demo, link You can see ...
- Vue搭建后台系统需要做的几点(持续更新中)
前言 持续更新 一.UI框架 推荐 Elemnet ui 二.图表 vue-schart npm install vue-schart -S <template> <div id=& ...
- vue addRoutes路由动态加载
需求:增加权限控制,实现不同角色显示不同的路由导航 思路:每次登陆后请求接口返回当前角色路由 核心方法:vue-router2.2.0的addRoutes方法 + vuex 以下是我实现的获取菜单路由 ...
- VueJs 权限管理
程序运行时,router只配置登陆 首页404 等基本页面 import Main from '@/views/Main.vue'; // 不作为Main组件的子页面展示的页面单独写,如下 expor ...
- vue-router 动态添加 路由
动态添加路由可以用了做权限管理.登录后服务器端返回权限菜单,前端动态添加路由 然后在设置菜单 1.vue-router 有方法router.addRoutes(routes) 动态添加更多的路由规则 ...
- Vuejs 实现权限管理
程序运行时,router只配置登陆 首页404 等基本页面 import Main from '@/views/Main.vue'; // 不作为Main组件的子页面展示的页面单独写,如下 expor ...
- 【转】手摸手,带你用vue撸后台 系列四(vueAdmin 一个极简的后台基础模板)
前言 做这个 vueAdmin-template 的主要原因是: vue-element-admin 这个项目的初衷是一个vue的管理后台集成方案,把平时用到的一些组件或者经验分享给大家,同时它也在不 ...
- 使用 vue-element-admin 动态路由渲染
附上:vue-element-admin 官方文档 vue-element-admin https://panjiachen.github.io/vue-element-admin-site/zh/g ...
随机推荐
- laravel zh-CN
位置: 调用:
- Metasploit
1.启动Metasploit 声明:本次渗透测试的主机是我自己在自己的攻击主机上搭建的另一个操作系统,为了真实性设置了常见的IP地址,如有重合但绝对不是任何实体公司或者单位的IP地址. 所以不承担任何 ...
- python调用PHP方法
PHP代码如下:<?php $method = $argv[1]; $param1 = $argv[2]; $param2 = $argv[3]; if(isset($method) & ...
- js instanceof 检测某个对象是否是另一个对象的实例
例如File对象 $("#file").change(function(){ console.log($(this)[0].files[0]) console.log($(this ...
- Spring Cloud与Spring Boot版本匹配关系
Spring Cloud是什么? “Spring Cloud provides tools for developers to quickly build some of the common pat ...
- windows10的文件浏览器中无法搜索文件内容
系统:更新到最新的win10(2018年8月23日 23:54:31) 重现步骤:git clone一个项目,然后切换到它的另一个分支:打开文件夹浏览器(explorer),在右上角里输入想要查找的字 ...
- 微信JSAPI分享朋友圈调试经验:invalid signature签名错误排查
.invalid signature签名错误.建议按如下顺序检查: 1.确认签名算法正确,可用http://mp.weixin.qq.com/debug/cgi-bin/sandbox?t=jsapi ...
- 修改Tomcat默认连接数
<Connector port=" protocol="HTTP/1.1" connectionTimeout=" redirectPort=" ...
- ORA-01536: 超出表空间 'tablespace_name' 的空间限额
表空间限额问题知识总结: 表空间的大小与用户的配额大小是两种不同的概念 表空间的大小是指实际的用户表空间的大小,而配额大小指的是用户指定使用表空间的的大小 把表空间文件增大,还是出现 ...
- golang ffmpeg 做网络直播
最近在公司做在线视频转码的工作,研究了下ffmpeg 最后直接研究了下网络直播,我是在我自己的mac 上面测试的,效果,还可以,先看看效果图吧 ffmpeg 我是通过brew安装 的,这步就略了 VL ...