自定义指令

1、全局定义

Vue.directive('指令的名字',{
  bind(el,binding){
    // el 绑定的dom
    // binding 指令的基本信息
    //    name: 指令名
    //    rawName: 指令完整名字
    //    value: 指令的值
    //    expression: 表达式
    //    arg: 指令的参数
    //    modifiers: 指令的修饰符
    //    def 可以调用别的声明周期函数
  },
  inserted(el,binding){},
  update(el,binding){},
})

2、私有定义

new Vue({
  directives:{
    //key 指令名
    //value 指令的配置
    名字:{
      bind(el,binding){
        // el 绑定的dom
        // binding 指令的基本信息
        //    name: 指令名
        //    rawName: 指令完整名字
        //    value: 指令的值
        //    expression: 表达式
        //    arg: 指令的参数
        //    modifiers: 指令的修饰符
        //    def 可以调用别的声明周期函数
      },
      inserted(el,binding){},
      update(el,binding){},
    }
  }
})

3、使用指令

<div v-指令名:参数.修饰符.修饰符2="值"></div>
参数 ==> binding.arg
修饰符 ==> binding.modifiers
值 ===> bindingd.value