vuev-permission权限指令

控制页面及按钮的显示隐藏

src/directive/permission/index.js import permission from './permission' 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 src/directive/permission/permission.js import store from '@/store' function checkPermission(el, binding) { const { value } = binding let auths = sessionStorage.getItem('pvAuths')?JSON.parse(sessionStorage.getItem('pvAuths')):[]; if(!auths) { auths = [] } if (typeof value === 'undefined') { return true } const btnPermission = value const hasPermission = auths.includes(btnPermission); if (!hasPermission) { el.parentNode && el.parentNode.removeChild(el) } } export default { inserted(el, binding) { checkPermission(el, binding) }, update(el, binding) { checkPermission(el, binding) }, } src/directive/index.js export * as Permission from './permission'; 在main.js中使用 import * as directives from '@/directive' // global directives Object.keys(directives).forEach(key => { Vue.use(directives[key].default) })