ref 包裹的数组索引赋值（如 arr.value[0] = newitem）不会触发视图更新，因其绕过 ref 的 setter 且未触发 proxy 追踪；应使用 splice、push 等变异方法或整体替换数组。
不会触发视图更新。
ref 包裹的数组，索引赋值不响应
当你用 ref([]) 创建一个响应式数组，再写 arr.value[0] = newItem，Vue 无法侦测这个变化。原因在于：ref 的响应式机制依赖于对 .value 属性的 getter/setter 拦截，而 arr.value[0] 是对数组内部元素的直接操作，绕过了 ref 的 setter，也未触发 Proxy 对数组的增强追踪（该追踪仅对 reactive 生效）。
正确做法：用响应式安全的方式改数组项
以下操作能确保更新被 Vue 捕获并刷新视图：
- 用 splice() 替换指定位置的元素：arr.value.splice(index, 1, newItem)
- 用 pop()/push()/shift()/unshift() 等内置变异方法修改数组
- 整体替换数组（赋新数组）：arr.value = [...arr.value.slice(0, index), newItem, ...arr.value.slice(index + 1)]
- 若数组项本身是对象，可直接改其属性（如 arr.value[0].name = 'new'），因为对象属性变更在深层响应下会被追踪
对比 reactive 数组的行为
reactive 包裹的数组同样不支持 arr[0] = ... 这类索引赋值；但 reactive 内置了对数组方法的增强，所以 push/splice 等操作天然响应。而 ref 数组要靠你手动调用这些方法或整体赋值，不能依赖索引直改。
小提醒：别混淆 ref 和 $refs
这里的 ref 是响应式 API（import { ref } from 'vue'），不是模板里的 ref="xxx"（那是 DOM 引用，完全不参与响应式系统）。后者修改 this.$refs.xxx.value 不会触发视图更新，除非同步更新对应的数据源。
前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！
