vue后台管理权限

笔记：

核心想法：

1.登陆后获得用户角色，通过角色获得用户的权限，注入权限对应的路由。
2.刷新页面，从localStorage用角色(更好的方式是通过token)再次获得所属权限，再次注入路由。在管理界面左端循环权限对应的路由菜单。
3.localStorage存用户的信息（token），权限路由不会存。

所有的路由分为2种：

• 公共路由：所有用户可以查看。
• 权限路由：当前用户权限所属的路由。

实现控制的方式分两种：

• 通过 vue-router addRoutes 方法注入路由实现控制
• 通过 vue-router beforeEach 钩子限制路由跳转

一般来讲，需要采用第一种方式，addRoutes注入的方式，第二种每次判断，开销比较大，而且一次性拿不到角色对应的所有路由列表。这个列表需要再登陆后立即渲染在左边。

权限的控制分为好几种:

• 一级菜单的权限控制，
• 二级菜单的权限控制，
• 按钮级别的权限控制。

前后端约定控制方式有2种：

• 后端返回路由控制列表
• 前后端约定路由控制列表

vue 权限管理 - 小虫1 - 博客园 

Vue动态路由的实现(后台传递路由，前端拿到并生成侧边栏)-js教程-PHP中文网

https://www.jianshu.com/p/99c7b6fc1442