自定义指令（全局Vue.directive）(局部directive)

1、目标：获取标签，扩展额外的功能；

--两种语法--

全局注册

1、Vue.directive('指令名称'，{inserted(){}})

Vue.directive('myfocus', {

//inserted:钩子函数，el：指绑定的元素

  inserted(el) {

   //打印出来看看有没有触发

    console.log('123');

     //元素聚焦
    el.focus()
  }
})

局部注册

  //局部指令 directives:{"指令名称":{inserted(){}}}
  directives: {
    myfocus: {
      //inserted:解析元素的时候触发钩子 el:指令所绑定的元素，可以直接操作DOM
      inserted(el) {
        el.focus();
      },
    },
  },
};

2、指令传值

目标：自定义一个输入框文字的颜色指令

<template>
  <div>
    用户名：<input type="text" v-mycolor="'blue'" /><br />
    电话：<input type="text" v-mycolor="'#0f0'" /><br />
  </div>
</template>

<script>
exp