一尸折、問題
在開發(fā)過程中，經(jīng)常遇到這樣的情況：當(dāng)data里邊已經(jīng)聲明或賦值過對(duì)象或者數(shù)組（數(shù)組里邊的值是對(duì)象）時(shí)另凌，再向?qū)ο笾刑砑有碌膶傩裕绻麓藢傩缘闹到溽＃遣粫?huì)更新視圖的吠谢。
根據(jù)官方文檔定義：如果在實(shí)例創(chuàng)建之后添加新的屬性到實(shí)例上，它不會(huì)觸發(fā)視圖更新诗茎。
- 當(dāng)你把一個(gè)普通的js對(duì)象傳入Vue實(shí)例作為data選項(xiàng)工坊，vue將遍歷此對(duì)象所有的屬性，并使用Object.defineProperty把這些屬性全部轉(zhuǎn)為getter/setter敢订。
受現(xiàn)代js的限制王污，vue不能檢測(cè)到對(duì)象屬性的添加或刪除。由于Vue會(huì)在初始化實(shí)例時(shí)對(duì)屬性執(zhí)行g(shù)etter/setter轉(zhuǎn)化過程楚午，所以屬性必須在data對(duì)象上存在才能讓vue轉(zhuǎn)換它昭齐，這樣才能讓它是響應(yīng)的。
舉個(gè)例子：
data () {
return {
student: {
name: '',
age: ''
}
}
},
mounted () {
this.student.age = 24
}
眾所周知矾柜，直接給student賦值操作阱驾，雖然可以新增屬性，但是不會(huì)觸發(fā)視圖( 頁面 )
更新原因是：vue.js的屬性必須在 data 對(duì)象上才能讓 Vue.js 轉(zhuǎn)換它怪蔑，才能讓它是響應(yīng)的啊易。
二、解決方法
vue.$set(obj,key,value)
舉例：
mounted () {
this.$set(this.student,"age", 24)
}
第一個(gè)參數(shù)：改變的對(duì)象
第二個(gè)參數(shù)：改變的對(duì)象中的屬性
第三個(gè)參數(shù)：改變的屬性值
