提供鉴权思路 真实开发中根据情况选择
// permission.js
/*
key 身份信息
*/
function checkPermission (key) {
let permissionList = [1, 2, 3, 4, 5];// 有权限的身份信息 开发中接口请求获得
return permissionList.indexOf(key) > -1;
}
Vue.directive('permission', {
inserted (el, binding) {
let key = binding.value; //获取v-permission = '3'
if (key) {
let hasPermission = checkPermission(key);
if (!hasPermission) {
el.parentNode && el.parentNode.removeChild(el); //没有权限移除元素
}
} else {
throw new Error('需要定义key')
}
}
})
main.js中引入permission.js 即可全局使用指令鉴权
<button v-permission='3'>我有权限</button>
<button v-permission='6'>我有权限</button>