v-permission 按钮权限

建一个  permission.js
 

export default {
  inserted(el, binding, vnode) {
    const { value } = binding;

    const list = [1,2,3,4,5,6];

    if (value) {
      const hasPermission = list.some(item => {
        return item == value;
      });

      if (!hasPermission) {
        el.parentNode && el.parentNode.removeChild(el);
      }
    } else {
      throw new Error(`need single url! `);
    }
  }
};

同目录下在建一个index.js
 

import permission from "./permission";
const directives = {
    permission
}
export default {
    install(Vue){
        Object.keys(directives).forEach(key=>{
            Vue.directive(key,directives[key])
        })
    }
}

然后在main.js里面引入
import Directives from "./directive/index.js"
Vue.use(Directives)
 

页面使用

<div v-permission="1">测试</div>