+directive/permission.js
import Vue from 'vue';
Vue.directive('permission', {
inserted: function (el, binding) {
const { value } = binding
const buttonList = store.state.user.permission || []
if (value) {
const hasPermission = buttonList.some(btnKey => btnKey === value)
if (!hasPermission) {
el.parentNode && el.parentNode.removeChild(el)
}
} else {
throw new Error(`需要指定权限标识! 如:v-permission="'table_del'"`)
}
}
})
- main.js
import directive from './directive/permission' // 引入directive
Vue.use(directive) // 引入directive