Warning: Each child in a list should have a unique "key"

Question

{Data.map(datas => <Col lg={4}>
    <PriceCard key={datas.id}  title={datas.title}  text={datas.text}  price1={datas.price1} price1text={datas.price1text} price2={datas.price2} price2text={datas.price2text} price3={datas.price3} price3text={datas.price3text} price4={datas.price4} price4text={datas.price4text} price5={datas.price5} price5text={datas.price5text}  imgUrl={datas.imgUrl} />
</Col>)}

And I get his error, but I have unique key.

Warning: Each child in a list should have a unique "key"

I think you should assign `key` to `` as well. Basically the parent component inside the map should have a `key` prop — Thennarasu Ramasamy, May 25 '21 at 13:45
The `` components are the children in the list, they are the ones that should have the key. — RemcoGerlich, May 25 '21 at 13:46

score 0 · Accepted Answer · answered May 25 '21 at 13:58

0

Col should have a key as well. Try doing this:

{Data.map((datas, index) => <Col lg={4} key={index} >)}

answered May 25 '21 at 13:58

Emmanuel M. Achana

16
1
1

oh okay i add "rowkey" to my data and there is no error anymore but key={index} didn't work – Onur Yüksekkaya May 25 '21 at 14:28

Warning: Each child in a list should have a unique "key"

1 Answers1