본문 바로가기
개발 관련 개념들

[React.js] Each child in a list should have a unique "key" prop 계속 뜰 때

by 코곰 2021. 5. 12.

분명 나는 unique한 key 값을 준 것 같은데!!!!!!!

 

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

 

에러가 계속 떴다. ㅜ 검색을 열심히 해보니

 

stackoverflow.com/questions/34576332/warning-each-child-in-an-array-or-iterator-should-have-a-unique-key-prop-che

 

Warning: Each child in an array or iterator should have a unique "key" prop. Check the render method of `ListView`

I built an app with ReactNative both for iOS and android with a ListView. When populating the listview with a valid datasource, the following warning is printed at the bottom of the screen: Warn...

stackoverflow.com

쓰레드를 찾을 수 있었고, 

 

"rendering root component of the list"에 key값을 추가해야된다는 무나와씨의 답변이 내 코드를 구제해 주셨다.

 

 

기존의 나의 코드

쓸데 없는 <>, </>가 방해 요소였다.

* 이전에 코딩할 때, PostItem말고도 다른 컴포넌트를 map할 일이 있을까봐

* <>, </> 의 'React Fragment'를 넣어줬었는데,

* key값이 루트 컴포넌트에 적용되지 않아 계속 에러가 뜨는 것이었다! (Fragment부분도 map되어 버리니)

 

 

 

바꾼 코드

* 필요없는 <>, </>를 지우고

* PostItem이 루트 컴포넌트가 되며, 여기에 key값이 적용되니 에러가 해결됐다!만세!

댓글