React JSX의 List Rendering에서 key값 설정하기 (.map)

React에서 구조화된 객체를 여럿 가지는 배열을 통해서 List를 그리는 전형적인 패턴이 있다. const data = [{ title: "hi", content: "hello" }, ... { title: "bye", content: "sad" }] 해당 데이터를 React는 다음과 같이 그린다. function App() { return ( {data.map(el => ( {el.title} {el.content} ))} ) } React에 익숙하다면, 위의 코드에서 경고 메세지를 예상할 수 있을 것이다. 바로, key prop을 설정하라는 메세지이다. Warning: Each child in a list should have a unique “key” prop. 이 경고를 없애기 위해서 주로 사용..