由于 JavaScript 的限制，Vue 不能检测数组和对象的变化。尽管如此我们还是有一些办法来回避这些限制并保证它们的响应性。

Vue 无法检测 property 的添加或移除

var vm = new Vue({
  data:{
    a:1
  }
})
vm.a = 2
// `vm.a` 是响应式的
vm.b = 2
// `vm.b` 是非响应式的

解决方案

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

//如果需要赋多个值
// 代替 `Object.assign(this.someObject, { a: 1, b: 2 })`
this.someObject = Object.assign({}, this.someObject, { a: 1, b: 2 })

由于 Vue 不允许动态添加根级响应式 property，所以你必须在初始化实例前声明所有根级响应式 property，哪怕只是一个空值：

var vm = new Vue({
  data: {
    // 声明 message 为一个空值字符串
    message: ''
  },
  template: '<div>{{ message }}</div>'
})
// 之后设置 `message`
vm.message = 'Hello!'