自定义指令—给按钮加权限

const has = Vue.directive('has', {

  bind: function (el, binding, vnode) {

    // 获取按钮权限

    if (!Vue.prototype.$_has(binding.value)) {

      // el.parentNode.removeChild(el);

      el.style.display = 'none';

    }

  },

  update: function (el, binding, value) {

    if (!Vue.prototype.$_has(binding.value)) {

      el.style.display = 'none';

    }

  }

})

/**

 * 判断用户是否拥有操作权限

 * 根据传入的权限标识，查看是否存在用户权限标识集合

 * @param perms

 */

Vue.prototype.$_has = function (perms) {

  let isExist = false

  let permissions = store.state.perm

  if (getStore('hpt-account') == 0) {

    isExist = true;

  } else {

    for (let i = 0, len = permissions.length; i < len; i++) {

      if (permissions[i] === perms) {

        isExist = true;

        break

      }

    }

  }

  return isExist

};

export {has}

然后在main.js中引入

import has from './utils/permission'

最终在页面中使用 v-has="xxx"即可