vue实现检测数组
检测数组变化的方法
在Vue中，可以通过多种方式检测数组的变化。Vue本身对数组的某些方法进行了响应式处理，但某些情况下需要手动触发更新或使用特定方法。
使用Vue.set或this.$set
对于直接通过索引修改数组元素的情况，需要使用Vue.set或this.$set方法确保响应式更新。
this.$set(this.items, index, newValue)数组变更方法
Vue重写了以下数组方法，调用这些方法会自动触发视图更新：
- push()
- pop()
- shift()
- unshift()
- splice()
- sort()
- reverse()
使用watch监听数组变化
可以通过watch选项监听数组变化，设置deep:true可以深度监听数组内部变化。
watch: {
items: {
handler(newVal, oldVal) {
// 处理变化
},
deep: true
}
}计算属性检测数组变化
计算属性可以基于数组状态返回派生值，当数组变化时会自动重新计算。
computed: {
filteredItems() {
return this.items.filter(item => item.active)
}
}使用Vue.observable创建响应式数组
Vue 2.6+可以使用Vue.observable创建响应式对象，包含数组。
const state = Vue.observable({
items: []
})注意事项
直接通过索引修改数组元素不会触发视图更新，必须使用Vue.set方法。修改数组长度也不会触发更新，应该使用splice方法替代。
