Vue2数组和对象的响应式检测变化

• 数组

1. 用index来操作数组中的元素，不会被检测
2. 用length属性来改变数组长度不会被检测

// 状态
data () {
return {
	arr: [1, 2, 3, 4]
}

arr[4] = 5 // index
arr.length = 6 // length 
// Vue2不能检测到变化

• 解决方法

3. vue全局方法Vue.set(arr, index, value)
4. splice()

Vue.set(arr, 4, 5)
arr.splice(4, 1, 5)
arr.splice(6)

• 对象

5. 属性的添加和删除不能被检测: 只有在data中的对象属性才会被转化为getter和setter

• 解决

6. Vue.set(obj, newPro, newValue)
7. obj.assign({}, oldobj, newobj)

data () {
	return {
		obj: {
			a: 1,
			b:2
		}
	}
}
Vue.set(this.obj, 'c', 3)
this.obj.assign({}, this.obj, { b: 3 })