공부기록/[강의노트] Udemy React 완벽가이드 1~100
# 70 [udemy React 완벽 가이드 노트] Keys에 대해
Jenner
2022. 9. 10. 16:19
리액트는 데이터의 목록을 렌더링하는데 있어서 특별한 개념을 갖는데
그 개념은 리액트가 발생할 수 있는 어떤 성능 손실이나 버그 없이 효과적으로
그런 목록을 업데이트하고 렌더링 하도록 존재한다.
새 목록을 DUMMY_EXPENSES로 추가할 때
가장 앞부분으로 추가하도록 했는데
맨 밑부분이 깜박이면서 렌더링이 되는 것은
맨 밑부분으로 추가한 후 기존에 있는 목록을 업데이트해서
화면에 보이는대로 순서를 다시 바꾸어 준다.
이 일을 하면 버그생성 가능성이 생기며 성능 저하의 원인이 될 수 있다.
그리고 이 상황에서는 위와같은 워닝메시지를 보게 된다.
리액트에게 어디에 아이템이 추가되어야 하는지 알려주기 위해
key 속성을 추가해주어야 한다.
key속성을 추가하면 각각의 아이템들을 인식해
어디에 위치해야 할지 인식하여 효율적으로 업데이트 하게 된다.