和數組一樣,Vue 不能檢測到對象屬性的添加或刪除。由於 Vue 會在初始化實例時對屬性執行 getter/setter
轉化過程,所以屬性必須在 data
對象上存在才能讓 Vue 轉換它,這樣才能讓它是響應的。
兩種不同情況下使用的方法:
Vue.set(object, key, value) Vue.set(vm.someObject, 'b', 2)
vm.$set this.$set(this.someObject,'b',2)
如果想向已有對象上添加一些屬性,例如使用 Object.assign()
或 _.extend()
方法來添加屬性。但是,添加到對象上的新屬性不會觸發更新。在這種情況下可以創建一個新的對象,讓它包含原對象的屬性和新的屬性:
// 代替 `Object.assign(this.someObject, { a: 1, b: 2 })` this.someObject = Object.assign({}, this.someObject, { a: 1, b: 2 })