Vue自定义私有和全局指令

通过Vue.directive来自定义全局指令：

1、全局指令的定义方法为：
Vue.directive(‘指令名称’，{} );
其中 {} 内包含的函数被称为**“钩子函数”**。
2、常用的钩子函数有：

• bind:function(el,{});
• inserted:function(el,{});
• updated:function(el,{});

let vm=new Vue({
Vue.directive('color',{	
     bind:function(el,binding){	
              el.style.color=binding.value;
              // binding用来接收指令中传递过来的参数
              // binding.value对应 blue
              // binding.expression对应 'blue'
     }
     })
})

// 使用指令：
<input type="text" v-color="'blue'">

3、说明：
三种函数的执行时机不一样。
其中bind:function在指令刚刚绑定到元素上时，就会执行指令。而inserted:function则是被绑定了指令的元素刚刚插入到dom树中才执行。updated:function则是指令有更新时执行。
4、总结：
需要对元素的CSS样式进行操作时，使用bind，需要对JS行为进行操作时(比如说：文本框自定获取焦点)则需要使用inserted。

通过directives来定义私有指令：

let vm=new Vue({
	el:'#app',
	directives:{
	'color':{
		bind:function(el,binding){
		el.style.color=binding.value;}
		}
	}
})
// 使用指令
<input type="text" v-color="'red'";

其中directives是一个对象。