在React / Redux中创建新项目并稍后保存到服务器

Question

我正在使用React / Redux构建一个Web应用程序，我遇到了一个问题，想出一个简单的解决方案：创建一个新的（嵌套的）记录并稍后将其保存到服务器。

我正在使用normalizr创建一个平面状态树。基本上我的（相关）状态结构如下所示：

projects: {
  as1234hhafs: {
    _id: as1234hhafs
    pages: [kljafsldasdf, asdfas8990],
    ...
  }
},
pages: {
  kljafsldasdf: {
    _id: kljafsldasdf,
    name: 'New page',
    ...
  },
  asdfas8990: {
    _id: asdfas8990,
    name: 'New page 2',
    ...
  }
}

每个项目都有一个子文档数组。我想要做的是创建一个新页面（子文档）并编辑它的数据（和子文档），并在点击时将其保存到服务器。但我对如何使用推荐的redux / normalizr状态结构实现这一点感到茫然。

如果新记录还没有ID，我该怎么办呢？一旦服务器的响应为记录分配ID和ID，我将如何管理它？

我希望我的问题很清楚。

Answer 1

两种可能的方法：

1. 将未保存的条目存储在州的单独部分，例如在一个不需要id的数组中。保存后，将它们移动到持久对象集，并且您知道id。合并这两组对象以便在UI上显示它们不应该太复杂。

2. 在前端生成ID 根据您要使用的权衡取舍，这可能是递增数字，随机UUID或完全不同的内容。然后，您可以在保存记录后将此临时ID替换为永久ID。

请注意，这不是一个详尽的列表，还有许多其他可能的方法。只是让你入门的东西。

Answer 2

您可以生成本地（前端）ID并将后端ID存储为每个页面的属性。无论何时需要使用它，都要使用后端ID。

或者，您可以将未保存的页面存储在状态树中的其他位置，但这会使页面组件的信息来源更加复杂。