改变数组表示的状态的正确模式是什么？

问题描述

改变数组表示的状态的正确模式是什么？

在 Vuex 4 的标准示例中： VUEX4 GitHub example1

建议删除一个数组元素，插入一个新元素。

 state.todos.splice(index,1,{
      ...todo,text,done,});

这是更改 Vuex 4、Vue 3 的 store 数组的标准模式吗？

另一个例子直接修改数组中的对象字段： VUEX4 GitHub example2

   const cartItem = state.items.find(item => item.id === id)
   cartItem.quantity++

在 Vuex 4 中改变状态数组而不丢失反应性的正确方法是什么？ 是否可以通过索引直接修改数组的项目作为example2？ VUEX4 是否具有反应性 - 或者反应性是唯一组件的属性？

解决方法

没有约定俗成。将 Vuex 视为只是 javascript。在您展示的第一个示例中，作者这样做是因为这是最方便的方式。

这是在索引处插入元素的评分最高的答案：How to insert an item into an array at a specific index (JavaScript)?，这就是示例 1 所做的。

也许您感到困惑，因为 Vue 2 有反应性警告，而 .splice 示例可能不是反应性的。 Vue 3 没有 Vue 2 的反应性警告。