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

Question

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

Answer 1

您希望使所有对象都不可变.您将其转换为可变对象的唯一时间是您需要将其发送到服务器.而且,由于您从服务器返回一个普通的JSON对象,因此在获取它时将其转换为不可变对象.

创建新项目时,您还需要一个不可变对象,并将其发送到商店.因此,商店的状态只是一组不可变向量中的不可变对象.您需要将JSON对象发送到服务器的事实是与服务器通信的实现细节,并且只应由处理通信的存储/服务知道.

所以流程将是:

1. 从服务器获取项目作为JSON对象数组
2. 将该JSON数组转换为不可变记录的不可变向量
3. 将不可变向量传递给组件以呈现它们
4. 编辑/创建新项目时,请确保只处理不可变记录(即,在组件中保留不可变newItem记录this.state,并在表单字段更改时更新该记录).
5. 当用户点击Save时,发送this.state.newItem到商店,商店将项目添加到其不可变向量,并将其转换为JSON并将其发送到服务器.