【无标题】

Vue不能检测到对象属性的添加或删除：三种解决方法

官网——深入响应式原理（https://cn.vuejs.org/v2/guide…）中介绍到：受现代 JavaScript 的限制 (以及废弃 Object.observe)，Vue 不能检测到对象属性的添加或删除。由于 Vue 会在初始化实例时对属性执行 getter/setter 转化过程，所以属性必须在 data 对象上存在才能让 Vue 转换它，这样才能让它是响应的。

上面的a是响应式的，所以a的改变后会自动渲染页面；
但是b是在vm实例创建之后添加的属性，所以他不是响应式的，当我们改变b的值的时候，通过DevTool看到的数据并不会改变，除非我们在DevTool中刷新数据，而且页面也不会刷新。
有三种解决方案：
1、方案一：利用Vue.set(object,key,value)

Vue.set(vm.obj,"sex","man")

2、方案二：利用this.$set(this.object,key,value)

this.$set(this.obj,"sex","man")

3、方案三：利用Object.assign({},this.obj)

this.obj.sex = "man";
this.obj = Object.assign({},this.obj)

或者下面方式
this.obj = Object.assign({ },this.obj,{“sex”,“man”})