Vue中watch 的用法

2022-09-04 12:12:10 字數 1027 閱讀 4448

fullname: }

firstname:

上面的**的效果是,當我們輸入firstname後,wacth監聽每次修改變化的新值,然後計算輸出fullname

這裡 watch 的乙個特點是,最初繫結的時候是不會執行的,要等到firstname改變時才執行監聽計算。那我們想要一開始就讓他最初繫結的時候就執行改怎麼辦呢?我們需要修改一下我們的 watch 寫法,修改過後的 watch **如下:

watch: ,

// 代表在wacth裡宣告了firstname這個方法之後立即先去執行handler方法

immediate: true

}}

注意到handler了嗎,我們給 firstname 繫結了乙個handler方法,之前我們寫的 watch 方法其實預設寫的就是這個handler,vue.js會去處理這個邏輯,最終編譯出來其實就是這個handler

immediate:true代表如果在 wacth 裡宣告了 firstname 之後,就會立即先去執行裡面的handler方法,如果為false就跟我們以前的效果一樣,不會在繫結的時候就執行。

watch 裡面還有乙個屬性deep,預設值是false,代表是否深度監聽,比如我們 data 裡有乙個obj屬性:

obj.a: }

obj.a:

優化,我們可以是使用字串形式監聽其中某個值

watch: ,

immediate: true,

// deep: true

}}

vue中watch的用法

在平時工作中經常會遇到需要對某些資料進行監聽,根據資料的變化來執行某些操作,這個時候我們可以用到vue中的 watch,下面我們一起來看一下watch的具體用法 new vue watch newname和oldname分別對應name的新值和舊值,在函式中,可以對新舊值進行判斷來執行指定操作 使用...

vue 中 watch 的用法

首先確認 watch是乙個物件,一定要當成物件來用。物件就有鍵,有值。鍵 就是你要監控的那個傢伙,比如說 route,這個就是要監控路由的變化。或者是data中的某個變數。值可以是函式 就是當你監控的傢伙變化時,需要執行的函式,這個函式有兩個形參,第乙個是當前值,第二個是變化後的值。值也可以是函式名...

vue中的watch的用法

在vue中,使用watch來響應資料的變化。question data watch 直接寫乙個監聽處理函式,當每次監聽到 question值發生改變時,執行函式。也可以在所監聽的資料後面直接加字串形式的方法名 watch immediate和handler 上面的寫法使用watch有乙個特點,就是當...