Javascript 使用索引作为react中的键。当它受到影响和不受影响时';T

Javascript 使用索引作为react中的键。当它受到影响和不受影响时';T,javascript,reactjs,loops,for-loop,Javascript,Reactjs,Loops,For Loop,我使用以下代码段提供索引作为键 [{},{},{}].map((item,index) => <li key={index}/>) [{},{},{}].map((项,索引)=>) 当然,在React中,需要为数组的所有元素传递唯一的键值。否则,您将在控制台中看到此警告 Warning: Each child in an array or iterator should have a unique “key” prop. 因此,作为一个懒惰的开发人员,您只需将循环的索引值作

我使用以下代码段提供索引作为键

[{},{},{}].map((item,index) => <li key={index}/>)
[{},{},{}].map((项,索引)=>
当然,在React中,需要为数组的所有元素传递唯一的键值。否则,您将在控制台中看到此警告

Warning: Each child in an array or iterator should have a unique “key” prop.
因此,作为一个懒惰的开发人员,您只需将循环的索引值作为子元素的键值传入即可

当索引用作键时,重新排序列表或从列表中添加和删除项可能会导致组件状态出现问题。如果键是索引,则对项重新排序会更改它。因此,组件状态可能会混淆,并且可能会对不同的组件实例使用旧密钥

使用索引作为键是安全的例外情况有哪些?

  • 如果您的列表是静态的,并且不会更改
  • 该列表将永远不会重新排序
  • 将不会筛选列表(从中添加/删除项目 名单)
  • 列表中的项目没有ID

键应该是唯一的,但只能在其同级中使用。

map函数的第一个参数是元素本身,而不是键。此外,正如本网站副本中所述,react文档确实提到: