- 權(quán)限state
import {defineStore} from "pinia/dist/pinia";
// 用戶權(quán)限狀態(tài)
export const userPermission = defineStore('userPermission', {
// 狀態(tài)
state: () => {
return {
permissions: ['add', 'delete']
}
},
actions: {},
// 狀態(tài)的一些方法，類似于計算屬性
getters: {}
})
- 編寫指令
import {userPermission} from "./state/pinia-state";
let permissions = userPermission()
app.directive('permission', (el, binding) => {
if (permissions.permissions.indexOf(binding.value) < 0) {
// 移除當前元素
el.parentNode.removeChild(el)
}
})
- 按鈕需要的權(quán)限
<el-row class="mb-4">
<el-button v-permission="`add`">增1</el-button>
<el-button v-permission="`delete`" type="primary">刪2</el-button>
<el-button v-permission="`a1`" type="success">改3</el-button>
</el-row>
- 效果
image.png
