1、store/index.js：

import Vue from 'vue'
import Vuex from 'vuex'
Vue.use(Vuex)
export default new Vuex.Store({
  state: {
    buttonPermission: {
      add: true,
      edit: true,
      delete: false
    }
  }
})

2、directives/has.js：

export default {
  inserted(el, bindings, vnode) {
    const btnVal 
 
= bindings.value
    const boolean = vnode.context.$store.state.buttonPermission[btnVal]
    !boolean && el.parentNode.removeChild(el)
  }
}

3、使用指令

<template>
  <div id="app">
    <button v-has="'add'">新增</button>
    <button v-has="'edit'">編輯</button>
    <
 
button v-has="'delete'">刪除</button>
  </div>
</template>
<script>
import has from '@/directives/has'
export default {
  directives:{has}
}
</script>

　　將按鈕的英文傳入到指令中，在指令的回撥中將該按鈕在vuex中的狀態（true/false）找到，如果是false，通過父級節點將該節點刪除