Vue 自定义指令

和组件类似，有全局注册和局部注册，区别就是把 component 换成 derective。

钩子函数

指令定义函数提供了几个可选的钩子函数

bind：只调用一次，在指令第一次绑定到元素的时候调用，使用此钩子函数可以定义一个在绑定时执行一次的初始化操作；

inserted：被绑定元素插入父节点时调用 (父节点存在即可调用，不必存在于 document 中)；

update：被绑定元素所在模板更新时调用，不论绑定值是否变化。通过比较更新前后的绑定值，可以忽略不必要的模板更新；

componentUpdated：被绑定元素所在模板完成一次更新周期时调用；

unbind：只调用一次，指令与元素解绑时调用。

钩子函数的参数

**el：**指令所绑定的元素，可以用来直接操作 DOM；

// 使 input 插入时就获取焦点
<input type="text" v-focus>

Vue.directive('focus', {
  inserted: function(el) {
	el.focus()
  }
})

**binding：**一个对象，包含以下属性：

• name：指令名，不包括 v- 前缀
• value：指令的绑定值

<div v-text="text"></div>
...
data: {
  text: