1. 實現效果舉例

2. 前端實現
* 先導入mapGetters
```
import { mapGetters } from "vuex";
```
* 引入關鍵信息配置
```
export default {
computed: {
...mapGetters(["permissions"])
},
created() {
this.sys_user_add = this.permissions["sys_user_add"];
this.sys_user_upd = this.permissions["sys_user_upd"];
this.sys_user_del = this.permissions["sys_user_del"];
}
}
```
* 代碼中定義按鈕
```
<div style="height: 35px;">
<el-button-group>
<el-button size="small" v-if="sys_user_add" @click="handleCreate" icon="el-icon-circle-plus-outline">新增</el-button>
<el-button v-if="sys_user_upd" size="small" icon="el-icon-edit" @click="handleUpdate">編輯</el-button>
</el-button-group>
</div>
```
屬性域【v-if】是實現對其按鈕創建與不創建的控制。 值域【sys_user_add】是在頁面加載的時候,就自動獲取(登錄邏輯中以根據權限配置獲取)該用戶的操作權限列表。
3. 功能配置

圖中的權限表示:sys_user_add 就是作為“新增用戶”的操作權限控制標識,該配置必須與代碼中的按鈕控制標識一致才能起到控制的作用。
4. 對應的數據庫字段。

5. 應用舉例
ms-ui : /src/views/admin/user/index.vue