权限来控制按钮显隐。
实现:我们需要自定义指令来控制
- 新建一个文件btnOption.js
import Vue from 'vue'
Vue.directive('has ', {
inserted: function (el, binding) {
let str = binding.value.split(':')[0];
let strMenu = binding.value.split(':')[1];
let strBtn = binding.value.split(':')[2];
//最终的结果需要是
el.parentNode.removeChild(el);
})
//如果不是按钮,而是要隐藏某个页签可以使用自定义属性,通过v-if判断
Vue.prototype.$has = function (value) {
//最终的结果需要是boolean类型
return false
}
- main.js
import '@/utils/btnOption.js'
- 使用方法
<el-button v-has="'system:config:add'">新增</el-button>
<el-tab-pane label="配置" v-if="$has('system:config:peizhi')"></el-tab-pane>