[英]How to Fix 'Each child should have a unique key prop?
Hi everyone I would like to display for each element all of its sub-documents.大家好,我想为每个元素显示其所有子文档。
<div><ul>{designModdulles.map((designModdulle)=><li key={designModdulle.epreuves.nature_epreuve}>{designModdulle.epreuves.nature_epreuve}</li>) }</ul></div>
```
I wanted the sub documents to be displayed` in a map
but i had: Warning: Each child in a list should have a unique "key" prop.
Assuming this is JavaScript, the cause of the issue is that there are duplicate key
values.假设这是 JavaScript,问题的原因是存在重复的
key
。 You can use the index of each map entry to create a new key您可以使用每个映射条目的索引来创建一个新键
<div><ul>{designModdulles.map((designModdulle, index)=><li key={designModdulle.epreuves.nature_epreuve + index}>{designModdulle.epreuves.nature_epreuve}</li>) }</ul></div>
You may want to look at the following to see what your choices are (there are other resources as well): https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/map您可能想查看以下内容以了解您的选择(还有其他资源): https ://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Array/map
the problem of the key is resolved, but nothing is displayed in the key的问题解决了,但是里面没有任何显示
hello everyone here is the solution:大家好这里是解决方案:
<ul><li>{designModdulles.map((item,index)=>(<div key={index}>{item.epreuves.map((c, i)=>(<div key={i}>
<h3>{c.code_epreuve}</h3><Button>Insérer notes</Button><Button>Supprimer</Button> </div>) )}</div>))}</li></ul>
thank you谢谢你
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.