扩展@Deadfish答案。假设您有10个待办事项，每个项目都有状态（例如，是否处于编辑模式）。

在下一个渲染过程中，只剩下9个待办事项。例如，因为您删除了一项。

现在，react需要知道原始的10个项目中还有哪些仍然保留，因此它可以保留每个项目的状态，并仅重新渲染状态更改的项目。

那就是反应使用的目的key。如果使用索引作为键，则原始键为0..9。新的键是0..8。

这可能会导致几个问题：

1. React总是会得出结论，您删除了列表中的最后一项，但这不一定是正确的。因此，还有其他关于此的帖子，例如，这一篇
2. React总是会断定项目没有更改顺序，因此React会认为原始项目5的任何状态仍将是项目5的状态。编号。3，则所有项目应在列表中上移。这是另一个答案指出的。
3. 如果列表中的项目没有任何状态（只有道具）（例如待办事项的标题），则渲染效率将非常低下。如果删除第一个项目，则react会得出结论，即所有项目现在都有一个新文本，并将重新渲染所有剩余项目（而不是有效地从DOM中仅删除第一个项目）。

使用唯一和不变的键-不仅在单个渲染运行中 唯一 ，而且在 多个渲染循环中 尤其 稳定 -可以确保一切按预期工作，并确保有效地更新DOM。