vue-insagent-pc/src/utils/btnPermission.js

import store from '@/store'
const permission = {
    inserted(el, binding, vnode) {
        // console.log(binding,'binding')
        /*el: 指令所绑定的元素，可以用来直接操作DOM。
           binding: 一个对象，包含指令的很多信息。
           vnode: Vue编译生成的虚拟节点。*/
        const { value } = binding
        // 在登录后就可以缓存当前用户的btn权限。
        // sessionStorage.setItem('ButtonPermissions',JSON.stringify(['role:add']))
        // 自定义指令的执行函数，，取到登录缓存的按钮权限数组，赋值给全局对象userMsg
        global.ButtonPermissions = store.state.user.perms
        // global.ButtonPermissions = JSON.parse(sessionStorage.getItem('ButtonPermissions'))
        if (global.ButtonPermissions && global.ButtonPermissions.indexOf(value) > 0) {
            el.style.display = 'block'
        }
        else{
            el.style.display = 'none'
        }
        console.log(global.ButtonPermissions.indexOf(value), el);
       
    }
}
// 全局注册自定义指令
const install = function (Vue) {
    Vue.directive('permission', permission)
}

if (window.Vue) {
    window['permission'] = permission
    Vue.use(install); // eslint-disable-line
}

permission.install = install
export default permission