Immutable.js 将获取的数据转换为不可变的

Question

我正在构建一个类似于 TodoList 的简单 React Flux js 应用程序，其基本功能在于对某些实体的 CRUD 操作。当应用程序启动时，它从服务器获取数据并显示项目列表，然后我可以使用表单、编辑和删除创建新项目。我决定尝试 Immutable.js 方法，但面临一个问题：我应该何时以及将哪些数据转换为不可变对象。例如，当我获取列表时，我将其设为不可变（Immutable.fromJS()），然后分配给商店的状态，对吗？但随后我创建了新项目，从表单字段中获取普通对象，并且应该以某种方式将这些数据发布到服务器。为了避免再次加载列表，我想将此新项目添加到不可变商店列表中。那么当我必须将一些对象转换为不可变以供应用程序使用，并使用纯 json 获取数据并将数据发送到服务器时，我应该如何处理这种情况呢？

Answer 1

你想让你的所有对象不可变。将其转换为可变对象的唯一时间是需要将其发送到服务器时。而且由于您从服务器返回一个纯 JSON 对象，因此您在获取它时将其转换为不可变对象。

当您创建一个新项目时，您还需要一个不可变对象，并将其发送到商店。所以商店的状态只是不可变向量中的一堆不可变对象。您需要将 JSON 对象发送到服务器这一事实是与服务器通信的实现细节，只有处理通信的存储/服务才能知道这一点。

所以流程是：

1. 从服务器获取项目作为 JSON 对象数组
2. 将该 JSON 数组转换为不可变记录的不可变向量
3. 将该不可变向量传递给您的组件以进行渲染
4. 在编辑/创建新项目时，确保只处理不可变记录（即，在组件中的 this.state 上保留不可变的 newItem 记录，并在表单字段更改时更新该记录）。
5. 当用户点击保存时，将this.state.newItem 发送到商店，商店将项目添加到其不可变向量中，并将其转换为 JSON 并将其发送到服务器。