Vue自定義事件

Vue.directive("事件名稱",內容)，這樣寫比較抽象，看下面內容：

事件名稱不需要加“v-”，Vue會自動添加，使用時需要帶上v-。

html：

 搜索：<input type="text" class="form-control"  v-focus>

 Js：

Vue.directive("focus", {
    bind: function (el) {
        //bind:當指令綁定到元素上時自動調用這個函數,只會觸發一次。第一個參數是el，表示綁定的元素，
        // 是一個原生js對象，由於綁定時只在內存中，並未加入到dom中，所以不能進行dom操作，如focus。

    },
    inserted: function (el) {//inserted:表示元素插入到DOM時會執行inserted函數，只會觸發一次。
        el.focus()
    },
    updated: function () {//當Vnode更新的時候觸發updated，可以觸發多次。

    }
})

效果：在訪問頁面時自動獲取了焦點。

注意事項：bind與inserted均只能生效一次，且在inserted之前進行DOM操作無效， 比如進行focus操作。