从vuex状态复制集合以防止突变是标准做法吗？

Question

我在vue论坛上进行了搜索，有很多答案已经有2年了，而且很接近，但是我很难找到一个专门解决这个问题的方法（我在简化示例）：

1. 我有一个处于状态的对象数组（表的行数据）
2. 还有一个带有subComponents的tableComponent，用于循环遍历数据并在集合中为每个项目创建一行
3. 要求是将输入添加到绑定到rowData.foo的表中的每一行
4. tableComponent具有一个已计算的属性，该属性从状态中获取rowData，将这些对象放入新的（已修改的）数组中，然后将其传递到tableComponent模板中。
5. 然后添加带有rowData.foo的v模型的输入
6. 这行得通，但我最近意识到，它无需修改即可修改集合中rowData项的foo属性。

我可以删除v模型并使用@input提交更改，但是我有两个问题，这应该如何工作

如果我要阻止这些更改，直到我点击“确认更改”按钮，它是否是标准/性能 _.cloneDeep整个集合在tableComponent计算属性或vuex getter中。似乎有很多开销，但也许我对此太保守了？

允许v模型直接更新RowData.foo，这意味着每行都知道要修改哪个RowData项，因为我正在对vuex集合中的单个对象进行更改，这是使vuex突变_的最佳实践找到对象，进行更改，然后将整个集合散布回商店？

与其他大多数关于Vue的问题一样，我有多种方法可以使其发挥作用，但是我不确定哪种方法最有效/最好。感谢您的帮助！

更新 简单代码沙箱在这里：https://codesandbox.io/embed/vuex-store-olrvk 看看没有动作调用如何更新vuex数据？

Answer 1

如果需要缓冲用户对反应式模型的更改（用于提交操作），则需要制作深层副本。没有其他办法了。完全正常。

Answer 2

在检查了您的codeSandbox示例之后，我发现是的，您的商店状态数据v-model在不使用任何突变的情况下发生了突变，这是由于v-model（双向绑定）检测到了数据点内存并在后台对其进行突变...当然，这是Vue开发人员允许的，即使我很难在任何文档中都找到它（顺便说一下，在文档上，他们展示了使用{{1 }}，但他们为此使用了商店突变）

关于what is the most performant/best pattern，我认为这种方式最简单，也更简洁（代码更少）