Vue.directive(自定義名,{
選項
})
鉤子函數(shù)(選項):
- bind:只調(diào)用一次跪妥,指令第一次綁定到元素時調(diào)用暇仲,用這個鉤子函數(shù)可以定義一個在綁定時執(zhí)行一次的初始化動作
- inserted:被綁定元素插入父節(jié)點時調(diào)用(父節(jié)點存在即可調(diào)用久妆,不必存在于document中)
- update 被綁定元素所在的模板更新時調(diào)用缩麸,而不論綁定值是否變化,通過比較更新前后的綁定值缀遍,可以忽略不必要的模板更新
- componentUpdated :被綁定元素所在模板完成一次更新周期時調(diào)用
- unbind :只調(diào)用一次慕匠,指令與元素解綁時調(diào)用
鉤子函數(shù)的參數(shù) - el: 指令所綁定的元素,可以用來直接操作DOM
- binding:一個對象域醇,包含以下屬性:
--name:指令名台谊,不包括v-前綴
--value:指令的綁定值,
--oldValue:指令綁定的前一個值譬挚,僅在update和componentUpdate鉤子中可用锅铅。無論值是否改變都可用
--expression綁定值的字符串形式。
--arg:傳給指令的參數(shù)
--modifiers:一個包含修飾符的對象 - vnode: Vue編譯生成的虛擬節(jié)點
- oldVnode:上一個虛擬節(jié)點减宣,僅在update和componentUpdate鉤子中可用
demo