自定义指令
自定义指令主要用于，除系统提供外，自己对DOM的底层操作。
例如当页面加载时需要将一个文本框为自动获得焦点。只要你在打开这个页面后还没点击过任何内容，这个输入框就应当还是处于聚焦状态。
我们通过全局自定义指令和局部自定义指令来讲解autofouce案例。
全局自定义指令
在全局API中通过Vue.directive( id, [definition] )来注册或获取全局指令。
参数:
id表示自定义的指令名称
definition为自定义指令的定义，一般可以含有几个生命周期钩子函数
bind() 指令第一次绑定到元素上时调用，且只调用一次，可执行初始化操作
inserted() 被绑定元素插入到DOM时调用
update() 被绑定元素所在模板更新时调用
componentUpdated() 被绑定元素所在模板完成一次更新周期时调用
unbind() 指令与元素解绑时调用，只调用一次
bind与inserted在加载页面初始化实例并挂载之后调用
update，componentUpdated 当指令所绑定的元素模板更新时调用
unbind解绑时调用
语法:
// 注册Vue.directive('my-directive', { bind: function () {}, inserted: function () {}, update: function () {}, componentUpdated: function () {}, unbind: function () {}})// 注册 (指令函数)Vue.directive('my-directive', function () { // 这里将会被 `bind` 和 `update` 调用})// getter，返回已注册的指令var myDirective = Vue.directive('my-directive')示例:
//el参数为绑定的元素，自动载入Vue.directive('focus',{ inserted:function(el){ console.log(el); el.focus(); }});<div id="app"> <input type="text" v-focus></div>2.当然，你也可以使用简单的指令函数。
// 注册 (指令函数)Vue.directive('my-directive', function () { // 这里将会被 `bind` 和 `update` 调用})3.我们可以在bind函数中为其添加两个参数，第一个是绑定的元素，第二个是当前自定义指令对象。
Vue.directive('focus',{ bind(el,binding){ console.log(binding); }});局部，实例的自定义指令
局部的自定义指令定义在directives选项中，所配置的数据与全局的完全一样。
directives:{ focus:{ inserted(el){ //当被绑定元素插入到DOM的时候，进行自动获焦 el.focus(); }}focus即为指令名称，使用时直接，v-focus即可。
el参数和binding参数，获得绑定元素与当前指令对象只有在bind函数绑定之后才能得到值。所以inserted，update也是可以的。