Directive 自定义指令

//全局指令 
Vue.directive('指令名',{ //el 就是被绑定的DOM元素   bind:function(el){}, //指令绑定到元素上但是元素没有插入到Dom树的时候   inserted:function(el){},//元素插入到DOM树之后 调用   update:function(el){},//当元素更新的时候,调用 可能多次触发。   componentUpdated:function(el){}, //所在组件的元素和子元素签不更新后调用
  unbind:function(el){}, //指令函数解绑时调用。
});
Vue.directive("指令名",钩子函数对象)
//使用
Vue.directive("name",{....});
<div v-name></div>
//私有的自定义指令

new Vue({
  el:"#app",
  methods:{},
  filters:{}, //过滤器
  directives:{ //都得加s了
    name:{
      bind:function(el){},// 可以对元素样式进行操作
      update:function(el){},
    }
  },

});

钩子函数的参数:

  el:绑定的DOM元素,

  binding :一个对象,包含绑定指令的信息 name(指令名字) value(指令绑定的参数) expession(指令表达式)

  vnode:虚拟节点

  oldVnode:上一个虚拟节点。

原文地址:https://www.cnblogs.com/panjingshuang/p/11926278.html