快速掌握vue中的自定義指令

自定義指令

注冊全局的自定義指令
Vue.directive(),
其中，傳遞兩個參數，第一個參數傳遞的是指令的名字，第二個參數是一個對象。

詳細的例子

// 第一個參數是指令的名稱，第二個參數是一個對象。
Vue.directive('focus', {
  bind: function (el) {
    // 注意：每個函數中呢，第一個參數永遠是el， 表示被綁定了指令的那個元素，這個el參數，是一個原生的js對象
    el.focus()
  },
  // 在元素剛綁定指令的時候，元素還沒有放到dom中去，這個時候，調用focus方法沒有作用
  // 因為一個元素只有插入dom之后，才能獲取焦點
  inserted: function (el) {
    el.focus()
  },
})

對象，我們介紹三個方法

bind:

每當指令綁定到元素上的時候，會立即執行bind函數，只執行一次

inserted

表示元素插入到dom中的時候，會執行inserted函數

updated

當window更新的時候，會執行updated,可能會觸發多次。

總結 在使用的時候，需要給指令前加一個v-