React 中按键的意义是什么？

Question

React 中按键的意义是什么？我读到在循环中使用索引并不是键的最佳解决方案。为什么？

Answer 1

React 使用键为您渲染的每个 React 元素提供“身份”。当两个元素具有相同的键时，它们被视为相同的元素，否则，它们是不同的。当元素在列表中重新排列或移动到渲染函数中的不同位置时，这会有所帮助，因此 React 可以执行高效的 DOM 操作来实现您想要的最终结果。请参阅文档以获取更多信息。

我读到在循环中使用索引并不是键的最佳解决方案。为什么？

因为这与根本不给列表项键是一样的。如果你有一个像这样的列表[a, b, c]，那么你删除了中间的一个，[a, c]如果它们都是由索引键控的，React会认为你刚刚删除了最后一个，而不是中间的那个。