v-model 綁定對象不實時更新 原因和解決方案

今天遇到這樣一個問題 動態的向一個被綁定的對象中添加屬性。Vue 無法檢測 property 的添加或移除。由於 Vue 會在初始化實例時對 property 執行 getter/setter 轉化，所以 property 必須在 data 對象上存在才能讓 Vue 將它轉換為響應式的。例如：但是在實際應用中問題出現了：在向對象中添加屬性后，與對象綁定的組件內容卻未發生變化，必須要再次刷新組件，其內容才會變為更改后的內容。

var vm = new Vue({
  data:{
    a:1
  }
})

// `vm.a` 是響應式的

vm.b = 2
// `vm.b` 是非響應式的

對於已經創建的實例，Vue 不允許動態添加根級別的響應式 property。但是，可以使用 Vue.set(object, propertyName, value) 方法向嵌套對象添加響應式 property。例如，對於：

Vue.set(vm.someObject, 'b', 2)

您還可以使用 vm.$set 實例方法，這也是全局 Vue.set 方法的別名：

this.$set(this.someObject,'b',2)

至此，v-model 綁定數據不實時更新的問題方才得到了解決。