在我的 React 应用程序中，我使用数据库 ID 作为键来呈现从服务器返回的一组项目。
items.map(item => <Item key={item.id}/>)
这工作正常，但现在我想做乐观更新，所以我在将新项目提交到服务器之前将它们插入到数组中，然后在post操作完成时添加数据库 id。现在我的数组简要地包含了由于缺少键而导致错误的没有 id 的项目。
该怎么办？我知道使用索引作为键被认为是一种反模式（https://www.menubar.io/react-keys-index/），所以这是不可能的。我也不想为这些项目生成新的唯一 ID，因为一旦将它们保存到数据库中，它们都会有两个唯一 ID。我考虑对未保存的对象使用随机键，但这似乎是一个不稳定的解决方案。
这种情况是否有最佳实践解决方案？我不可能是第一个遇到这个问题的人。
由于id数据库中正在更新的项目很可能会在成功发布请求时发生更改，因此您可以将index这些特定项目用作键，例如
items.map((item, index) => <Item key={item.id || index}/>)
使用上述方法的一个可能的缺点是当您的其中一个与item.id重合时index，因此根据您的用例，您可以选择使用index或randomId仅用于那些尚未在数据库中更新的项目。
PS确保你没有
randomId在渲染方法中生成a，因为它会导致性能问题，导致组件在每次重新渲染时重新安装
如果您只追加到列表中，则可以使用从数组索引派生的 id，并保证永远不会与后端 id 冲突。如果您在后端或字符串中有递增的主键，则将索引之类的东西作为负值`New-${index}`。
或者，由于您无法id提前知道后端，因此我看不到其他解决方案，然后使用 uuid 生成器临时id为该项目生成一个。这样的 id 实际上是无冲突的。
使用索引是非常危险的，因为其他项目之一可能已经使用该 ID。