为什么在 Vue 对象上新增一个属性会丢失响应式？

为什么在Vue对象上新增一个属性会丢失响应式？

• 在Vue2中，Obejct.defineproperty只会对属性进行监听，而不会对对象进行监听

• 就是说在新增一个属性的时候，它没有新开一个Obejct.defineproperty方法，所以也不会调用它里面的setter方法，即没有响应式

• 同理，delete xxx也会丢失响应式，因为它不会触发Obejct.defineproperty中的setter方法，就不会有发布订阅的机会，虽然删是删了，但是页面不会变，即丢失响应式

• 如果你需要让新增的属性也具有响应式，你可以使用this.$set方法，譬如

  this.$set(this.data, 'age', 19)
  

• 如果你需要让删除的属性也具有响应式，你可以使用this.$delete方法，譬如

  this.$delete(this.data, 'age')