指令定義函數提供了幾個鉤子函數(可選):node
bind: 只調用一次,指令第一次綁定到元素時調用,用這個鉤子函數能夠定義一個在綁定時執行一次的初始化動做。 inserted: 被綁定元素插入父節點時調用(父節點存在便可調用,沒必要存在於 document 中)。 update: 被綁定元素所在的模板更新時調用,而不論綁定值是否變化。經過比較更新先後的綁定值,能夠忽略沒必要要的模板更新。 componentUpdated: 被綁定元素所在模板完成一次更新週期時調用。 unbind: 只調用一次, 指令與元素解綁時調用。
鉤子函數參數:express
el: 指令所綁定的元素,能夠用來直接操做 DOM 。 binding: 一個對象,包含如下屬性:name: 指令名,不包括 v- 前綴。 value: 指令的綁定值, 例如: v-my-directive="1 + 1", value 的值是 2。 oldValue: 指令綁定的前一個值,僅在 update 和 componentUpdated 鉤子中可用。不管值是否改變均可用。 expression: 綁定值的字符串形式。 例如 v-my-directive="1 + 1" , expression 的值是 "1 + 1"。 arg: 傳給指令的參數。例如 v-my-directive:foo, arg 的值是 "foo"。 modifiers: 一個包含修飾符的對象。 例如: v-my-directive.foo.bar, 修飾符對象 modifiers 的值是 { foo: true, bar: true }。 vnode: Vue 編譯生成的虛擬節點,查閱 VNode API 瞭解更多詳情。 oldVnode: 上一個虛擬節點,僅在 update 和 componentUpdated 鉤子中可用。