frontend

react에서 map 사용하여 컴포넌트를 렌더링할 때 key 속성이 있어야 하는 이유

• key속성이 없다면 React는 새로운 아이템을 어디에 추가해야 할 지 모른다 -> 맨 아래에 추가하며 모든 아이템의 내용을 업데이트하여 내용을 교체한다.

• 참고

배열의 index를 키로 사용하면 안되는 이유

• 인덱스를 key로 사용 중 배열이 재배열되면 컴포넌트의 state와 관련된 문제가 발생할 수 있다.
• 컴포넌트 인스턴스는 key를 기반으로 갱신되고 재사용된다.
• 인덱스를 key로 사용하면, 항목의 순서가 바뀌었을 때 key 또한 바뀐다.
• 그 결과로, 컴포넌트의 state가 엉망이되거나 의도하지 않은 방식으로 바뀔 수 있다.