按钮权限

第一步:

将需要权限管理的按钮处理成图所示结构:
按钮权限

第二步:编写指令

import store from '@/store'
export default {
  install(Vue) {
    Vue.directive('permission', {
      inserted(el, binding) {
        const { value } = binding
        const buttonList = store.getters && store.getters.buttonList;
        if (value) {
        // some 遇到 return true 就是终止遍历
          const hasPermission = buttonList.some(val => {
            return value === val
          })
        // 无权限则移除元素
          if (!hasPermission) { el.parentNode && el.parentNode.removeChild(el) }
        } else {
          throw new Error(`需要指定权限标识!如 v-permission="`usersManager-search`"`)
        }
      }
    })
  }

}

第三步:main中注册

//权限按钮
import permission from './directive/btnRoles'
Vue.use(permission)

第四步: 页面写入

 <el-button
        type="primary"
        size="small"
        plain
        @click="handleSearch()"
        v-delaySubmit
        v-permission="'usersManager-search'"
        >{{ $t("common.search") }}</el-button
      >
上一篇:java-有什么理由不使用git-masquerading-as-cvs作为cvs的升级吗?


下一篇:linux 运行.sh出现 Permission denied 解决办法