6.自定义指令directives

1.定义全局指令
在main.js中声明全局指令

//自定义全局组件（directive没有s）
Vue.directive('focus',{
    inserted:function(el) {
      el.focus();
    }
});

在元素中使用自定义指令

<input type="text" v-focus>

2.局部指令
直接在当前组件中添加directives

<script>
    export default {
        name: "hello",
        directives:{
            focus:{
                inserted:function(el){
                   el.focus();
                }
            }
        }
</script>

bind:当指令绑定到元素上时，会执行该函数，只调用一次。（主要做样式的处理）
inserted:表示元素插入到DOM时，会执行该函数。（主要做页面加载后的一些触发事件，例：自动获取焦点，若写在bind中，不生效。因为自动获取焦点必须时页面 dom加载完成才能获取焦点。）
updated：所在组件的 VNode 更新时调用，但是可能发生在其子 VNode 更新之前。
componentUpdated：指令所在组件的 VNode 及其子 VNode 全部更新后调用。
unbind：只调用一次，指令与元素解绑时调用。