项目中有一个权限管理,权限管理下有角色列表,权限列表。角色列表中有一个分配权限的功能,这是个难点,给大家分享下自己写的。
首先分配权限按钮加上点击事件,这里需要通过插槽来拿到点击时获取到数据,这里用的是element里给的封装好的。代码如下:
<template slot-scope="scope">
<el-button
type="warning"
icon="el-icon-setting"
size="mini"
@click="grant(scope.row)"
>分配权限</el-button
</template>
下边就是在methods里边调用方法,首先我们要想清除,调用方法的目的,目的是为了让权限的所有数据在点击分配权限按钮时获取到并且显示在模态框里,如图:
那么我们就要请求接口获取数据,数据拿到之后渲染到页面之上。数据渲染页面之后我们需要点击确定按钮进行权限分配data(展示数据)node-key(每个树节点用来作为唯一标识的属性,整棵树应该是唯一的)props(配置选项