vue中对象与数组更新与重新渲染

vue规定，不能监测到data里的对象未声明的属性，也就是说，新增的对象属性他是无法监测到的！！

对象与数组的更新有一些注意事项，官方文档说的很清楚。

对于数组

• push()
• pop()
• shift()
• unshift()
• splice()
• sort()
• reverse()

以上方法修改数组支持更新！！
对于嵌套数组，你可以使用forEach和map做修改！
你要根据索引修改数组值或者修改数组长度，这样做：

vm.$set(vm.items, indexOfItem, newValue)
vm.items.splice(newLength)

PS: splice功能强大（原数组会改变），后面打印的原数组,稍微说一下.
一个参数，代表切割后的的数组长度

 [1,2,3].splice(2) //[1,2]

两个参数，切割开始下标(包含)，切割长度。

[1,2,3].splice(0,1) //[2,3]

三个参数，切割下标（包含），切割长度，替换数组。

[1,2,3].splice(0,2,4) //[4,3]   
	[1,2,3].splice(0,2,4,5) //[4,5,3]

对于对象
还是由于 JavaScript 的限制，Vue 不能检测对象属性的添加或删除，对于已经创建的实例，Vue 不允许动态添加根级别的响应式属性，要添加或更改这样做：

//在单文件里使用用this代替vm
vm.userProfile = Object.assign({}, vm.userProfile, {
  age: 27,
  favoriteColor: 'Vue Green'
})
//或者
Vue.set(object, propertyName, value)

一些注意事项
使用了缓存吗（比如keep-alive组件 或者v-once命令） v-once我栽了跟斗！
有用到setTmeOut等改变了this的函数，注意改回this指向
还有个强制刷新方法 this.$forceUpdate() 放在你更改数据后！

vue3 已经使用proxy,数组与对象更新的问题将不再是问题，大家是不是很期待了呢
这里有一个学习项目： admin-web-vue3-TypeScript

写出来是一个记录和相互学习的目的！

你想吃彩虹糖吗？我有长颈鹿，可以挤给你！