为什么Vue中更新数组内对象时，Vuex状态未同步触发视图更新？

• 第一个错误：EDIT_CAR mutation 中使用forEach遍历数组时，参数c是指向数组元素对象的临时引用，直接执行c = car只会修改这个临时引用的指向，既没有改动state.cars数组中存储的引用，也没有修改原有对象的属性，自然不会触发state更新和页面响应式重绘。
• 第二个错误：你之前尝试的c = {...c, car}写法存在语法错误，扩展运算符需要把新对象的属性展开，正确写法应该是c = {...c, ...car}，但即使修正语法，依然存在临时引用赋值不生效的问题。

修改EDIT_CAR mutation的逻辑，找到对应元素索引后，通过符合Vue响应式规则的方式更新数组：

EDIT_CAR: (state, updatedCar) => {
  const index = state.cars.findIndex(c => c.id === updatedCar.id)
  if (index !== -1) {
    // 方式1：用splice替换数组元素，Vue2/Vue3通用
    state.cars.splice(index, 1, updatedCar)
    // 方式2：直接修改原对象的所有属性
    // Object.assign(state.cars[index], updatedCar)
  }
}

两种写法都可以正确更新state，触发页面同步刷新。

内容的提问来源于stack exchange，提问作者Silvia