【VUE】Vue3通过数组下标更改数组视图为什么会更新？
在 Vue 3 中，使用 Proxy 来实现了对数组的响应式监听，相比于 Vue 2 使用的 Object.defineProperty()，Proxy 更加高效和灵活。
因此，在 Vue 3 中，通过数组下标直接更改数组中某一项的值，也能够被 Vue 正确监听到并触发视图更新。
Vue 3 中，数组的修改操作依然分为两类：变异方法和非变异方法。其中，非变异方法包括以下几种：
- filter
- map
- reduce
- some
- every
- slice 等
这些方法返回一个新数组，且不会修改原数组本身。而变异方法则会修改原数组本身，例如：
- push
- pop
- shift
- unshift
- splice 等
对于非变异方法，Vue 3 直接使用了 JavaScript 原生的数组方法，并且将其结果转化为响应式的数组，从而能够正确地进行界面的更新。
对于变异方法，Vue 3 则是使用 Proxy 对数组进行了处理，并且将变异方法进行了重写，从而实现了针对性的数组数据更新，避免了 Vue 2 中需要手动调用特殊方法来更新数组或者借助于 Object.defineProperty() 的方式实现。
因此，在 Vue 3 中，即使是通过数组下标直接修改数组中的某一项，也能够正常触发视图更新，从而实现了更好的响应式体验。
原文地址：https://blog.csdn.net/qq_22639647/article/details/142854838
免责声明：本站文章内容转载自网络资源，如本站内容侵犯了原著者的合法权益，可联系本站删除。更多内容请关注自学内容网（zxcms.com）！