参照《着手摸手,带你用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撸后台 读后感)的更多相关文章

  1. [React] React Router: Nested Routes

    Since react-router routes are components, creating nested routes is as simple as making one route a ...

  2. [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 ...

  3. Vue搭建后台系统需要做的几点(持续更新中)

    前言 持续更新 一.UI框架 推荐 Elemnet ui 二.图表 vue-schart npm install vue-schart -S <template> <div id=& ...

  4. vue addRoutes路由动态加载

    需求:增加权限控制,实现不同角色显示不同的路由导航 思路:每次登陆后请求接口返回当前角色路由 核心方法:vue-router2.2.0的addRoutes方法 + vuex 以下是我实现的获取菜单路由 ...

  5. VueJs 权限管理

    程序运行时,router只配置登陆 首页404 等基本页面 import Main from '@/views/Main.vue'; // 不作为Main组件的子页面展示的页面单独写,如下 expor ...

  6. vue-router 动态添加 路由

    动态添加路由可以用了做权限管理.登录后服务器端返回权限菜单,前端动态添加路由  然后在设置菜单 1.vue-router 有方法router.addRoutes(routes) 动态添加更多的路由规则 ...

  7. Vuejs 实现权限管理

    程序运行时,router只配置登陆 首页404 等基本页面 import Main from '@/views/Main.vue'; // 不作为Main组件的子页面展示的页面单独写,如下 expor ...

  8. 【转】手摸手,带你用vue撸后台 系列四(vueAdmin 一个极简的后台基础模板)

    前言 做这个 vueAdmin-template 的主要原因是: vue-element-admin 这个项目的初衷是一个vue的管理后台集成方案,把平时用到的一些组件或者经验分享给大家,同时它也在不 ...

  9. 使用 vue-element-admin 动态路由渲染

    附上:vue-element-admin 官方文档 vue-element-admin https://panjiachen.github.io/vue-element-admin-site/zh/g ...

随机推荐

  1. ubuntu MySQL配置文件

    查看配置文件: locate my.cnf 查看配置文件路径: /记得要在配置环境变量后执行下列命令 which mysqld /usr/local/mysql/bin/mysqld --verbos ...

  2. Linux----centos安装mysql

    第一步wget http://repo.mysql.com/mysql-community-release-el7-5.noarch.rpm 第二步rpm -ivh mysql-community-r ...

  3. Allegro PCB Design GXL (legacy) 使用slide无法将走线推挤到焊盘的原因

    Allegro PCB Design GXL (legacy) version 16.6-2015 启用slide命令之后,单击鼠标右键,取消“Enhanced Pad Entry”即可.

  4. shell之ulimit应该注意的事项

    详细介绍:http://www.cnblogs.com/xiaOt119/archive/2012/06/13/2547930.html ulimit -n 2048 1.这个限制是针对单个程序的限制 ...

  5. jQuery之CSS选择器的处理机制

    <!DOCTYPE html><html lang="en"><head> <meta charset="utf-8" ...

  6. Plain Old Data (POD) (转)

    定义 POD类型包括下述C++类型,以及其cv-qualified的类型,还有以其为基类型的数组类型: 标量类型(scalar type) POD类类型(POD class type) 标量类型 术语 ...

  7. 006-Python函数

    Python函数(def) 函数是组织好的,可重复使用的,用来实现单一,或相关联功能的代码段.Python提供了许多内建函数,比如print().但你也可以自己创建函数,这被叫做用户自定义函数.函数能 ...

  8. 20165323 结对编程之四则运算week2-整体总结

    一.需求 实现一个命令行程序,要求: 1.自动生成小学四则运算题目(加.减.乘.除) 2.支持整数 3.支持多运算符(比如生成包含100个运算符的题目) 4.支持真分数 5.能判断错误,在输入错误结果 ...

  9. 腾讯应用宝Android 应用加固(乐固)操作说明(转)

    此处引用腾讯云对加固的优点说明如下: 为什么应用需要加固? 若应用不做任何安全防护,极易被病毒植入.广告替换.支付渠道篡改.钓鱼.信息劫持等,严重侵害开发者的利益. 应用进行安全防护,防止应用分发后, ...

  10. 关于K8S证书生成方面的脚本草稿

    周日在家里计划的. 俺不加班,但在家学习的时间一样没少! 还没弄完,只粗粗弄了etcd证书. #! /usr/bin/env bash set -e set -u set -x THIS_HOST=$ ...