修改数据页面不更新的原因和解决方案

1.动态给对象新增属性，或删除属性是不会触发视图更新得，vue检测不到
如下：

data(){
	return {
		obj:{
			a:123
		}
	}
}
delete this.obj.a;
this.obj.b=456;

2.通过数组下标修改数组得元素或者手动修改数组的长度，vue识别不到

data(){
	return {
		obj:[{
			a:123
		}]
	}
}
this.obj[0]={
	a:456
};
obj.length=2;

解决方法：
1.动态添加一个属性
vue.set(object, key, newValue) 有三个参数，分别是(要修改的对象或数组/属性或下标/修改后的值)
2.动态添加多个属性
有时候我们需要添加多个对象属性，就需要用两个对象的属性创建一个新对象。

下边这种写法是错误得：

Object.assign(newObj, {
	name: '小太阳',
	age: 18
})

应该是这样：

let newObj = Object.assign({}, newObj , {
	name: '小太阳',
	age: 18
})

原因：
对象是引用类型，直接改变对象的某属性但是指向地址没变，vue不一定能监控到，所以当我们新建一个对象，就直接改变了他的指向地址。

3.vue自带的强制更新
this.$forceUpdate()，强制视图更新

• 如果为对象添加少量的新属性，可以直接采用Vue.set()
• 如果需要为新对象添加大量的新属性，则通过Object.assign()创建新对象
• 如果你需要进行强制刷新时，可采取$forceUpdate() (不建议)