vue中watch的使用問題

2021-09-22 17:57:28 字數 793 閱讀 3293

1、如果有change原生事件盡量用原生,不要用watch,畢竟watch只是封裝了一層,效能各方面不如原生方法。

2、盡量不要watch陣列,如果非得監控陣列的變化,就設定乙個flag,陣列變flag變,watch對應的flag來處理。

當前有兩個陣列:

tempy = ["label1", "label2", ... ,"labeln"]

tempz = [

[10, 11, 12], [20, 21, 22], ... , [100, 101, 102]

]

最開始將這兩個陣列賦給2個變數

y = tempy

z = tempz

然後修改陣列的值

tempy.push("label123")

tempz.push([123, 456, 789])

同時使用watch觀察四個量的變化

watch: ,

tempy (val1, val2) ,

z (val1, val2) ,

tempz (val1, val2)

}

由上可知 z 和 tempz 是正常的,但是 y 和 tempy 見鬼了樣的。

因為陣列是指向變數,所以 tempy 變了 y 會跟著變所以同時觸發嗎?

但是為什麼 z 和 tempz 又不滿足這個原因呢,因為是二維陣列嗎?

為什麼呢???

綜上所述,建議見2:盡量不要watch陣列!

vue中watch的使用

text v model.lazy username watch lazy的作用,在enter鍵按下或者失去輸入框失去焦點後觸發此方法的缺點 當值第一次繫結的時候不會執行監聽函式,只有當值改變的時候才會執行 需求 如果我們想在第一次繫結的時候就執行此監聽函式,則需要設定immediate為true....

vue中watch的使用

vue中的watch是乙個比較重要的概念,通過他我們可以檢測data的變化,下面進行詳細的介紹。watch定義方式如下 即在watch中,舉例如下 en 函式執行之後,分別在控制台中列印出new 2,old 1 以及 alert 666。舉例 最後貼出完整的 class add remark cla...

vue中watch的使用探索

在專案中,經常有需要根據乙個值的變化,來相應的更新另乙個值的狀態。vue給我們提供了乙個很好用的watch方法,可以方便監控,watch並不完美,需要具體了解一下。new vue phonelist xiaomi huawei oppo watch 對於字串 數字等簡單的型別,可以入以上形式直接監聽...