黑马程序员课程Vue实战项目_Element-ui——电商后台管理系统-权限管理制作

黑马程序员视频_权限管理

目录

权限管理

一.创建一个新分支

二.权限列表

三.角色列表

---

权限管理

一.创建一个新分支

创建新分支用来进行对应功能模块的开发

git branch——检查当前所处分支

git checkout -b rights——在master身上创建一个新的子分支rights

git branch——查看当前所处分支，可以看到我们已经处于rights子分支上了

git push -u origin rights——将本地的rights推送到云端进行保存

二.权限列表

1.创建组件Right.vue

2.通过路由的形式加载出来

在router/index.js头部导入Rights.vue,然后定义路由规则

需要作为一个子路由规则加载给Home去进行展示

 3.面包屑导航

 4.卡片视图

5.请求权限列表数据

 

 在data中定义一个空数组来获取权限列表的数据

在生命周期函数中发起权限列表的数据请求

 

getRightsList函数外面还没有定义，所以需要在methods中定义getRightsList函数

 6.渲染表格

 border——加边框线，stripe——隔行变色

 7.使用自定义插槽给权限等级加上标签

记得在plugins/element.js中导入并注册Tag组件

我们可以给三个tag添加v-if判断来进行按需展示

 

 权限管理业务分析，了解了用户与权限之间的关系有助于我们的权限管理的开发

三.角色列表

1.创建组件Roles.vue

 2.通过路由的形式加载出来

 

 3.面包屑导航

 

 4.获取数据

 在data中定义一个空数组用来接收数据，在生命周期函数中调用获取角色列表的函数，

在methods中定义获取角色列表的函数