vuejs學習4 自定義指令

2021-08-21 04:08:02 字數 662 閱讀 6315

1\只是方法名由component 改為了directive 。上例只是註冊了自定義指令

v-focus ,還沒有實現具體功能,下面具體介紹自定義指令的各個選工頁。

自定義指令的選項是由幾個鉤子函式組成的,每個都是可選的。

• bind : 只呼叫一次,指令第一次繫結到元素時呼叫,用這個鉤子函式可以定義乙個在繫結

時執行一次的初始化動作.

• inserted : 被繫結元素插入父節點時呼叫(父節點存在即可呼叫,不必存在於document 中) .

• update: 被繫結元素所在的模板更新時呼叫,而不論繫結值是否變化。通過比較更新前後

的繫結值,可以忽略不必要的模板更新。

• componentupdated : 被繫結元素所在模板完成一次更新週期時呼叫.

• unbind : 只呼叫一次,指令與元素解綁時呼叫。

html

>

id=>

v-lang=

"color"

>}

v-lang2=

"color"

>test

@click=

"add"

>add

οnclick=

'unbind()'

>解綁

課堂筆記之VueJS自定義指令

在vuejs的使用中,雖然有著一些除了預設設定的核心指令 v model 和 v show vue 也允許自定義指令來實現某些功能 例如 我們在載入頁面的時候實現輸入框自動獲取焦點的功能 當頁面載入時,我們還未對輸入框進行任何操作,並且輸入框已經處於聚焦狀態,顯示效果如下 我們可以按照官網的模板來編...

Vuejs全家桶系列(六) 自定義指令

vue.js 允許你註冊自定義指令,實質上是讓你教 vue 一些新技巧 怎樣將資料的變化對映到 dom 的行為。你可以使用vue.directive id,definition 的方法傳入指令id和定義物件來註冊乙個全域性自定義指令。定義物件需要提供一些鉤子函式 全部可選 自定義指令是用來操作dom...

Vuejs自定義select2指令

在做select2外掛程式的時候遇到一些坑,最終解決如下 vue.directive select2 var defaultopt options assign defaultopt,options el select2 options on select2 select e 雙向繫結不生效 繫結選...