Reactjs 在React中呈现项目列表时，如何处理新项目，这不需要'；你还没有身份证吗？

假设我们有一个组件，它呈现一个简单的项目列表，从一些API获取：

{this.state.items.map((item) => {
    return (
       <div key={item.id}>
          <p>Name: {item.name}</p>
          <p>Age: {item.price}</p>
       </div>
      )
})}

{this.state.items.map（（item）=>{
返回(
名称：{item.Name}

年龄：{item.price}

)
})}

id通常用作唯一密钥

但是，如果我有一些添加空的“项目”模型的功能，由用户填充，然后提交到服务器，该怎么办？这个对象还没有ID，因为服务器生成了ID。我当然在这里假设没有任何单独的状态和UI来处理表单，并且它都是相同的“项”数组的一部分（所有字段都是可编辑的）

假设在用户“添加”一批项目之前，我不想执行任何ajax请求。当涉及到列表键时，我将如何处理缺少id的情况，因为它将是未定义的？是否应该分配一个临时ID？（我认为这可能导致bug）

我知道使用索引是一种非常糟糕的做法，因为它可能导致排序和重新排序期间出现意外行为

解决这个问题的常规方法是什么

编辑：为什么我关心生成临时随机id

假设一个项目也可以编辑（意味着更改也会提交到某个/update端点）。当然，端点需要一个ID作为参数如果用户编辑（并提交）服务器上尚未实际创建的项目，会发生什么情况？。服务器将收到一个不存在的ID。这意味着我需要在前端提供一些逻辑，以确保这种场景是不可能的

还要记住，ID需要“稳定”，因为项目的唯一性取决于它。如果同一项从服务器接收到新ID，会发生什么情况？这需要我确保使用另一个/get ajax请求刷新整个项目列表（我通常这样做）

---

我认为在每次创建/更新ajax之后执行另一个/get ajax（或者只是返回新列表的另一个查询）会考虑所有场景，但这当然会导致一些开销，无论是在前端还是在服务器上。

我认为您可以使用某种随机数或哈希生成器来创建临时ID，当用户“准备好”创建项目时，可以通过服务器请求替换这些ID

我认为您可以使用某种随机数或散列生成器来创建临时ID，当用户“准备好”创建项目时，可以通过服务器请求替换临时ID

您不应该将api列表中的项目与新项目放在一起。您可以将它们显示在一起，但它们应该是不同的状态变量，因此更容易将它们发布到服务器并加以区分

---

至于使用哪个键，我只需要用类似于

临时列表项-${I}

或类似的东西来标识它。这意味着它是一个临时项，在创建它之后，您将从状态中删除临时列表，并只使用api的响应（它将为每个创建的项生成一个id），因此这些临时键将消失。但是，嘿，这只是我对它的看法，有很多其他的方法可以解决它。

你不应该把api列表中的项目和你的新项目放在一起。您可以将它们显示在一起，但它们应该是不同的状态变量，因此更容易将它们发布到服务器并加以区分

---

至于使用哪个键，我只需要用类似于

临时列表项-${I}

或类似的东西来标识它。这意味着它是一个临时项，在创建它之后，您将从状态中删除临时列表，并只使用api的响应（它将为每个创建的项生成一个id），因此这些临时键将消失。但是，这只是我对它的看法，有很多其他方法可以解决它。

使用哈希函数创建临时ID怎么样？在用户的项目“就绪”后，可以在服务器请求后替换哈希ID。你也可以使用随机数生成器。我想临时id可以有一些警告。请阅读我的编辑。使用哈希函数创建临时ID如何？在用户的项目“就绪”后，可以在服务器请求后替换哈希ID。你也可以使用随机数生成器。我想临时id可以有一些警告。请阅读我的编辑。据我所知，您最关心的是“如果用户编辑（并提交）一个尚未在服务器上实际创建的项目会发生什么情况？”但您如何编辑尚未在服务器端创建的项目？您是对的，但假设我的UI相当“愚蠢”，并为每个项目显示一个“更新”按钮。然后，用户可以忘记它是一个新项目，然后按下更新按钮，或者只是对所有项目执行“批处理”更新（当然这取决于我如何实现它。这里需要额外的逻辑）。底线是，我预见到了一些可能的陷阱：据我所知，您最关心的是“如果用户编辑（并提交）一个尚未在服务器上实际创建的项目会发生什么情况？”但您如何编辑尚未在服务器端创建的项目？您是对的，但假设我的UI相当“愚蠢”，并为每个项目显示一个“更新”按钮。然后，用户可以忘记它是一个新项目，然后按下更新按钮，或者只是对所有项目执行“批处理”更新（当然这取决于我如何实现它。这里需要额外的逻辑）。底线是，我预见到了一些可能的陷阱：我试图避免重复状态，因为它使事情变得有点复杂。另外，假设我的列表UI允许我在其他两个项目之间插入一个新项目，而不是列表的末尾。我如何“合并”这两个列表，同时保持它们的顺序？它不会重复，只是