Redux处理新项目和id

Redux handling new items and ids

本文关键字：id 新项目 处理 Redux      更新时间：2023-09-26

我有一个带有列表和id映射的标准化存储：

{
  "byId": {
    "images": {
      "10984": {"id": "10984", "src": "/img.png"}
    }
  },
  "myImages": [
    "10948"
  ]
}

现在我想创建一个新的图像，并将其添加到列表中。问题是，在将它发送到服务器之前，我没有它的id。所以我可以生成一个随机id

      "tempid19048": {"id": "tempid19048", src: "/img.png"}

  "myImages": [
    "10948",
    "tempid19048"
  ]

然后我把它保存到服务器上，并得到一个id，我调度了一个操作。我可能在状态的多个部分使用了tempid19048。

用新id更新所有内容的明智方法是什么？我是不是完全错了？

因为Redux实际上是一个客户端状态管理器，通常你只想镜像全局状态，就这样。正如你所知，与Flux/GraphQL不同，没有任何缓存、乐观更新等功能

也就是说，我发现redux乐观，模仿Flux对redux的乐观更新。我没有用过，但它看起来很好看。

但是，即使有所说的，我仍然会强调设计出任何临时id/乐观更新等需求的简单解决方案：

  1. 请求在服务器上创建映像
  2. 显示微调器
  3. 收到来自服务器的成功消息后，将具有新id的新映像添加到全局状态

您可以将"myImage"中的ID作为键值对。

"myImages": {
   "10948": "10948",
   "tempid19048": "tempid19048"
}

现在，无论你想在哪里使用，都可以用作

myImages["tempid19048"]

这将为您提供其当前值"tempid19048"。若你们需要改变这个tempId，你们只需要改变值，键保持不变。

"myImages": {
   "10948": "10948",
   "tempid19048": "newServerID"
}

因此，无论您现在使用tempID的位置有多少，您都只需要在一个位置进行更新。

相关文章：