前面已經介紹了幾個系統提供的指令，比如「v-text」、「v-bind」、「v-on」等等，本文我們來介紹下自定義指令的實現。
我們想建立乙個自動獲取焦點的指令，該功能其實可以通過document.getelementbyid('search').focus()來實現，但此處我們專門來介紹下自定義指令的實現方式。
效果實現
vue.
directive
("focus",,
inserted:
function
(el)
, updated:
function
(el)
})
>
姓名：type
="text"
v-focus
>
>
密碼：type
我們可以看到重新整理後搜尋框獲取到了焦點，說明我們建立的v-focus指令生效了。現在我們來具體解釋一下。
指令名稱
vue中所有的指令，在呼叫的時候，都以v-開頭，但是在定義的時候我們不用新增v-字首。
引數方法
定義 v-focus 指令時，第二個引數是乙個物件，這個物件身上有一些指令相關的函式，這些函式可以在特定的階段執行相關的操作。
鉤子方法
說明bind
當指令繫結到元素上時，會立即執行bind 函式，只執行一次
inserted
元素插入到dom中時，會執行 inserted 函式，觸發1次
updated
當vnode更新時，會執行 updated， 可能會觸發多次
方法的引數值
第乙個引數，永遠是el ，表示被繫結了指令的那個元素，這個el引數，是乙個原生的js物件。
第二個引數，binding：乙個物件，包含以下屬性：
引數說明
name
指令名，不包括 v- 字首。
value
指令的繫結值
oldvalue
指令繫結的前乙個值，僅在 update 和 componentupdated 鉤子中可用。無論值是否改變都可用。
expression
字串形式的指令表示式。例如 v-my-directive=「1 + 1」 中，表示式為 「1 + 1」。
arg傳給指令的引數，可選。例如 v-my-directive：foo 中，引數為 「foo」。
modifiers
乙個包含修飾符的物件。例如 v-my-directive.foo.bar 中，修飾符物件為 。
方法的使用場景
案例：定義乙個設定顏色屬性的指令：v-color。
vue.
directive
("color",,
})
>
姓名：type
="text"
v-focus
v-color="
'red'
">
>
密碼：type
和過濾器一樣，全域性指令所有的vm物件都可以共享，我們也可以為每個vm物件建立私有的指令，方法如下。
>
姓名：type
="text"
v-border="
'red'
">
>
密碼：type
="password"
>
div>
vue自定義指令（全域性 區域性）
vue除了提供了缺省內置的指令外，還允許開發人員根據實際情況自定義指令，它的作用價值在於當開發人員在某些場景下需要對普通dom元素進行操作的時候。vue自定義指令和元件一樣存在著全域性註冊和區域性註冊兩種方式。全域性指令 效果 區域性指令 顧名思義 區域性指令定義在組建內，寫法上最大的不同是定義時d...
vue自定義全域性和區域性指令
一 介紹 1 除了核心功能缺省內置的指令 v model和v show vue 也允許註冊自定義指令。2 自定義指令的分類 1 全域性指令 2 區域性指令 3 自定義全域性指令格式 vue.directive 指令id,指令定義物件 4 自定義區域性指令格式 略二 指令物件中的鉤子函式 乙個指令定義...
vue自定義指令 區域性指令和全域性指令
以後都優先用inserted，因為inserted裡獲取到的資訊比bind中多一些 在鉤子函式內部可以通過第二個引數binding的value屬性，獲取到指令繫結的引數 指令的修飾符可以用來做一些特定的邏輯判斷處理 注意 在鉤子函式內部的this不是vm例項，可以通過第三個引數vnode.conte...