在 vue.js 中,監聽數組和對象的變化,可以通過以下方式進行: 1. 數組:使用 v-for 指令和 :key 屬性進行監聽。 2. 對象:使用 v-model 指令對對象屬性進行監聽,需要通過 set 方法修改對象屬性。
如何監聽 Vue.js 中的數組和對象
數組
在 Vue.js 中監聽數組的變化非常簡單,只需使用 v-for 指令和 :key 屬性即可:
登錄后復制
當數組發生任何變化(添加、刪除或修改元素)時,受監聽的組件都將重新渲染。
對象
與數組類似,也可以通過使用 v-model 指令來監聽對象的變化:
<input v-model="object.property">
登錄后復制
當對象的屬性值發生改變時,受監聽的組件將更新。
需要注意的是,直接修改對象屬性并不會觸發 Vue.js 的響應式系統。因此,需要使用 Vue.js 提供的 set 方法來修改對象。例如:
this.$set(this.object, 'property', newValue);
登錄后復制
通過使用 set 方法,可以確保 Vue.js 檢測到對象的更改并更新受監聽的組件。