前端059_权限系统_菜单控制

左侧菜单导航布局组件位于 src/layout/components/Sidebar/index.vue ，其中Sidebar/SidebarItem.vue 渲染菜单子组件。

vue-element-template 默认是根据src/router/index.js 中配置的路由表，来动态渲染菜单的。

前端能控制的权限都只是页面级的，不同权限的用户显示不同的侧边栏和限制其所能进入的页面，其实前端再怎么做权限控制都不是绝对安全的，后端的权限验证才是最核心最重要的。后端则会验证每一个涉及请求的操作，验证其是否有该操作的权限，每一个后台的请求不管是 get 还是 post 都会让前端在请求 header 里面携带用户的token，后端会根据该 token 来验证用户是否有权限执行该操作。若没有权限则抛出一个对应的状态码，前端检测到该状态码，做出相对应的操作。

1、具体实现

1. 当用户登录后，会进行路由跳转到首页。跳转前，在路由拦截器里获取用户拥有的权限菜单。
2. 使用 vuex 权限菜单集合，根据 vuex 中可访问的菜单，渲染侧边栏组件。

2、EasyMock 查询用户菜单权限树接口

1. 添加查询用户菜单权限树接口
   请求URL： /system/menu/user/{userId}
   请求方式： get
   描述： 查询用户菜单权限树
   mock.js 配置：

{