vue 自定义指令

自定义指令是什么？

它是一个对象，对象的属性名即是指令的名字，对象的值是一个函数
第一个参数是指令所在的元素。

它分为全局自定义指令和局部自定义指令

全局：

	Vue.directive("focus", {
    	inserted: function (el) {
         	el.focus();
         	el.style.border = "4px solid pink"
     	},
	})

局部:

	directives:{
		foucs:{
			inserted: function (el) {
	            el.focus();
	            el.style.border = "4px solid pink"
	        },
		}
	}

使用

<input type="text" v-focus >

自定义指令一共有五个钩子函数

bind（） 指令第一次绑定时调用 只调用一次
inserted() 被绑定元素被插入父节点是调用，
update() 被绑定元素所在模板更新时调用，不论绑定值是否发生变化
componentUpdated() 被绑定元素模板完成一次更新周期是调用
unbind() 指令与元素解绑是调用 只调用一次