1.登录成功后,获取后台返回所有的按钮权限id,存到sessionStorage中
2.在main.js中自定义指令
const has = Vue.directive('has', {
inserted: function (el, binding) {
// 获取按钮权限
if (!Vue.prototype.$_has(binding.value)) {
el.parentNode.removeChild(el)
}
}
})
Vue.prototype.$_has = function (value) {
let isExit = false
let buttonpermsStr = sessionStorage.getItem('buttonpermissions')
if (buttonpermsStr === undefined || buttonpermsStr === null) {
return false
}
for (let i = 0; i < buttonpermsStr.length; i++) {
if (value === buttonpermsStr[i]) {
isExit = true
break
}
}
return isExit
}
export {has}
3.在按钮上直接写上v-has="后台返回的按钮id"
<el-button class="btns" @click="delItem" v-has="'666'">删除</el-button>