Vue 直接改数组下标视图不更新，响应式为什么失效

// Vue 2
this.$set(this.list, index, newItem);
// 或
this.list.splice(index, 1, newItem);
// Vue 3
list.value[index] = newItem;

把列表里某一项的选中状态直接赋值，数据变了但页面没反应，刷新后才显示。这类现象通常不是突然出现的，往前翻半天日志能看到苗头。

追下去是这么回事：Vue 2 无法拦截数组下标赋值，这种修改不触发依赖更新。

围绕「Vue 数组响应式」排查时，命令行跑一遍比在面板里点十次有用，面板会替你做掉不少隐式操作。权限不要一口气开到最大，先加到够用再往上试，范围小才好收。

把复现步骤压到三条以内，交给同事也能跑出来，才算真的定位清楚。改动写完就同步给同事，下一个人踩同一个坑，成本还是你的。

验证用真实数据走一遍，测试数据太干净，边界情况根本碰不到。能分两步做的操作就别合成一步，中间看一眼返回值，出问题好判断。

处理上按这个顺序：用可被拦截的方法替换元素；或用对象属性并预先声明；Vue 3 下确认用的是 reactive 代理对象。

确认没问题再收工，修改后页面立即更新，不需要手动刷新，其他列表项状态不受影响。