React渲染函数中嵌套map的key属性需内外全局唯一吗？

结论很明确：React的key只需要在同一层级的兄弟元素中保持唯一即可，不需要全局唯一。

React设计key的核心目的，是帮助它识别同一组兄弟元素的增删改变化，它的作用域仅限于当前的兄弟元素集合，和其他层级的元素完全无关。

拿你给出的嵌套map场景来说：

• 父级的<div key={index}>在parents数组渲染的兄弟div组里保持唯一（0和1），完全符合要求；
• 每个div下的<Child key={i}>在各自父div的子元素组里保持唯一（每个div内的0、1），也没有任何问题。

哪怕不同父元素下的子元素key重复，React也能通过它们的父层级区分开，不会把第一个div下key=0的Child和第二个div下key=0的Child混淆。

需要特别注意的只有一种情况：如果是同一层级的兄弟元素（比如直接在同一个map循环里渲染的组件），key必须唯一，否则React会抛出警告，还可能导致组件状态错乱、渲染异常。

内容的提问来源于stack exchange，提问作者Rongeegee