美文网首页
Vue中directives的用法

Vue中directives的用法

作者: 艾希_可可 | 来源:发表于2021-09-18 11:36 被阅读0次

import Vue from 'vue'
/权限指令/
const has = Vue.directive('has', {
bind: function (el, binding, vnode) {
// 获取按钮权限
let btnPermissions = vnode.context.route.meta.btnPermissions.split(","); if (!Vue.prototype._has(btnPermissions)) {
el.parentNode.removeChild(el);
}
}
});
// 权限检查方法
Vue.prototype.$_has = function (value) {
let isExist = false;
let btnPermissionsStr = sessionStorage.getItem("btnPermissions");
if (btnPermissionsStr == undefined || btnPermissionsStr == null) {
return false;
}
if (value.indexOf(btnPermissionsStr) > -1) {
isExist = true;
}
return isExist;
};
export {has}
/然后在main.js文件引入文件/
import has from './public/js/btnPermissions.js';

/页面中按钮只需加v-has即可/
<el-button @click='editClick' type="primary" v-has>编辑</el-button>

原文链接:https://blog.csdn.net/qq_31837621/article/details/80819126

参考来自
https://blog.csdn.net/qq_31837621/article/details/80819126?utm_medium=distribute.pc_relevant.none-task-blog-2%7Edefault%7EBlogCommendFromMachineLearnPai2%7Edefault-2.control&depth_1-utm_source=distribute.pc_relevant.none-task-blog-2%7Edefault%7EBlogCommendFromMachineLearnPai2%7Edefault-2.control

相关文章

  • Vue中directives的用法

    import Vue from 'vue'/权限指令/const has = Vue.directive('has...

  • [vue]--directives使用

    directives用法: 允许用户自定义标签,达到相应的效果。 官方说明:directives地址

  • 2021-01-26

    vue中自定义拖拽指令 指令(局部指令) directives:{ drag(el,bindings){ el.o...

  • 02、vue常用指令

    vue官网 在vue中,指令 (Directives) 是带有 v- 前缀的特殊属性,指令属性的值预期是单个 Ja...

  • vue2中的directives

    directives: 用于自定义vue指令 注册全局自定义指令:调directive(id, fun) 注册局部...

  • Vue中基本指令用法

    指令在Vue中是个很重要的功能,在Vue项目中是必不可少的。根据官网的介绍,指令 (Directives) 是带有...

  • vue学习(25)自定义指令

    知识点 1:局部指令new Vue({directives:{指令名,配置对象}})new Vue({direct...

  • [vue]--directives使用

    1.directives是什么?2.directives有什么作用?3.directives怎么使用?官网 1.d...

  • 工程化解决前端xss攻击

    编译前 通过vue-loader传入的compilerOptions.directives 与 baseOptio...

  • vue3.2 setup 之局部自定义指令

    在vue3.x中,注册局部自定义的指令是在setup方法外面,directives下面便可自定义指令,那在vue3...

网友评论

      本文标题:Vue中directives的用法

      本文链接:https://www.haomeiwen.com/subject/ilsbpltx.html