一、Vue Watch數組介紹
Vue是一款流行的前端框架，它採用了響應式的數據流。Vue Watch是Vue框架中的一種觀察者模式。在Vue中Watch可以監聽數據的變化並且進行一些操作，相當於設置了一個自動監聽，當數據變化時就可以自動觸發。
而Vue Watch數組則是針對數組類型數據的監聽，當數組內的數據變化時，Vue Watch數組可以自動監聽到這些變化並作出相應的處理。
二、Vue Watch數組的用法
Vue Watch數組是通過使用Vue的watch方法來實現的。在Vue實例中聲明一個watch對象，然後在watch對象中使用$watch來監聽數組的變化。
具體的代碼如下：
new Vue({
el:'#app',
data(){
return {
array:[]
}
},
watch:{
array:{
handler(newArray,oldArray){
console.log('數組變化了',newArray,oldArray)
},
deep:true
}
}
})
上面的代碼中，我們以數組array為例進行監聽，handler為回調方法，當數組中的數據項發生變化時，會自動觸發handler。
其中，deep:true表示深度監聽，它會監聽數組中的每一個子元素的變化，即當數組中的對象屬性發生變化時，也能被監聽到。
三、Vue Watch數組與Vue組件
Vue Watch數組不僅可以在Vue實例中使用，它同樣可以在Vue組件中使用。這時候我們需要通過 props 將數組傳遞給子組件，在子組件中對 Watch 數組進行監聽。
先上代碼：
父組件：
原創文章，作者：小藍，如若轉載，請註明出處：https://www.506064.com/zh-hk/n/182395.html
微信掃一掃 
支付寶掃一掃 