key는 리액트에서 어떤 항목을 추가, 삭제, 변경 등을 할 때
식별을 위해 사용하게 됩니다.
key는 변경되지 않는 유일값으로 설정하는데,
보통 ID가 유일하기에 ID값을 사용하는 경우가 많습니다.
key값이 존재하지 않으면 배열 중간의 값이 제거가 되는 등
해당 인덱스에 대한 값이 변하게 됩니다.
이때문에 고유한 값으로 key값을 주게 되면,
배열내 값이 변경이 되어서 리렌더링을 할 때,
값을 재사용 하는 경우 불필요한 렌더링을 줄일 수 있어서 최적화에도 도움을 줍니다.
'💻 더 나은 개발자 되기 > React' 카테고리의 다른 글
날짜 선택이 가능한 react-datepicker를 사용해보자. (date에 달력 아이콘 변경, input date 캘린더 커스텀) (0) | 2024.05.23 |
---|---|
비밀번호 input에 눈 아이콘으로 비밀번호 설정 껐다 켜기! with. tailwind (0) | 2024.05.21 |
zod를 사용해서 정규식 없이 이메일 검증하기 (간단 버전) (0) | 2024.05.21 |
리액트내에서 이미지 상대경로 불러오는 방법. react의 img src (0) | 2022.10.12 |
[React] onClick 이벤트. 버튼 클릭을 통한 페이지 이동 처리하기 (2) | 2022.10.07 |