在vue2中,我們可以使用watch{}來監聽data數據中特定的值,寫法也很簡單。基本上,所有的監聽都要寫成如下函數形式,函數接收兩個參數,一個是newvalue,另一個是oldvalue,分別代表新值和舊值,但在vue3中,我們所有的監聽不會寫在一起,而是我們需要監聽一個數據就需要寫一個watch。

官方對vue3中的watch可監視對象做了以下限制。簡而言之,就是只能是響應式數據,一個有返回值的函數,和包含響應式數據或者函數的數組。同樣的,vue3中的watch也有深度監聽deep和初始監聽immeaidte。需要注意的是如果你監聽的是reactive監聽的數據,是自動開啟深度監聽的。
vue3中的監聽寫法為:
watch(監聽的數據,(newvalue,oldvalue)=》{
console.log(當監聽數據改變時觸發的函數內容)
})
還有一個需要注意的問題,當我們監聽的響應式對象中的某個數據,而且這個數據是對象類型,當我們改變對象中的內容時,監聽會正常觸發,但是當我們修改整個對象,如果不寫成函數式,監聽是不會觸發的。如果監聽的不是對象類型而是普通類型,則沒有上述問題。
所以,我推薦大家監聽時,監聽的數據都要寫成函數式。

了解更多vue3知識點這里。
上一篇: 創建vue3的兩種方式
下一篇: vue3中的全局事件總線



