React中键的意义是什么?我读到在循环中使用索引不是键的最佳解决方案。为什么呢?
答案 0 :(得分:3)
React使用键为您呈现的每个React元素提供“标识”。当两个元素具有相同的键时,它们被视为相同的元素,否则它们是不同的。这有助于在列表中重新排列元素或移动到渲染函数中的不同位置,因此React可以执行有效的DOM操作以实现所需的最终结果。 See the docs for more info.
我读到使用循环中的索引不是键的最佳解决方案。为什么呢?
因为它与不给列表项的键完全相同。如果您有一个类似[a, b, c]
的列表,那么您删除中间的一个[a, c]
,如果它们都被索引键入,React会认为您刚删除了最后一个,而不是中间。
答案 1 :(得分:1)
键帮助React识别哪些项目已更改,已添加或已删除。应该给出数组内部元素的键,以使元素具有稳定的标识:
来自:React Documentation - Lists and Keys
如果键是索引,则移动项会更改它。因此,诸如不受控制的输入之类的组件状态可能会以意想不到的方式混淆和更新。