一. 如何追蹤變化
當(dāng)你把一個普通的 JavaScript 對象傳入 Vue 實例作為
data選項遭京，Vue 將遍歷此對象所有的屬性，并使用Object.defineProperty把這些屬性全部轉(zhuǎn)為getter/setter击纬。這些 getter/setter 對用戶來說是不可見的鼎姐，但是在內(nèi)部它們讓 Vue 能夠追蹤依賴，在屬性被訪問和修改時通知變更。
每個組件實例都對應(yīng)一個 watcher 實例症见，它會在組件渲染的過程中把“接觸”過的數(shù)據(jù)屬性記錄為依賴喂走。之后當(dāng)依賴項的 setter 觸發(fā)時，會通知 watcher谋作，從而使它關(guān)聯(lián)的組件重新渲染芋肠。
-
由于 Vue 會在初始化實例時對屬性執(zhí)行 getter/setter 轉(zhuǎn)化，所以屬性必須在
data對象上存在才能讓 Vue 將它轉(zhuǎn)換為響應(yīng)式的Ｗ裱痢帖池！var app = new Vue({ data:{ a:1 } }) // `app.a` 是響應(yīng)式的 vm.b = 2 // `app.b` 是非響應(yīng)式的
二. 怎么解決不在data屬性上的數(shù)據(jù)不是響應(yīng)式？
-
!! 可以用
Vue.set(object, propertyName, value)方法Vue.set(vm.someObject, 'b', 2) -
!!用
this.$set(object, protertyName, value)方法this.$set(this.someObject,'b',2)
