일 | 월 | 화 | 수 | 목 | 금 | 토 |
---|---|---|---|---|---|---|
1 | 2 | 3 | 4 | 5 | 6 | 7 |
8 | 9 | 10 | 11 | 12 | 13 | 14 |
15 | 16 | 17 | 18 | 19 | 20 | 21 |
22 | 23 | 24 | 25 | 26 | 27 | 28 |
29 | 30 |
Tags
- components
- 제로베이스
- HTML
- props
- TS
- 부트캠프
- 공식문서
- Tanstack
- CSS
- 프론트엔드 스쿨
- 개발공부
- 자바스크립트
- 프론트엔드
- JavaScript
- 리액트쿼리
- TypeScript
- react
- 인터넷
- JS
- 프론트
- 리액트
- 탄스택쿼리
- 코딩
- 개발
- hooks
- 타입스크립트
- 콜백
- Tanstack Query
- 개발자
- 조건문
Archives
- Today
- Total
목록map (1)
SUE 개발 블로그

Key React 공식문서에 정의된 내용이다. key는 리액트가 어떤 항목을 변경, 추가, 삭제할지 식별하는 것을 돕는다. 엘리먼트에 안정적인 고유성을 부여하기 위해 배열 내부의 엘리먼트에 지정해야 한다. map을 사용시 key값을 부여하는 가장 큰 이유는 고유성을 부여하는 것으로 사실 key값을 부여하지 않아도 에러는 발생하지 않지만 경고가 뜨게 된다. 예를 들어 map함수로 각 각 1,2,3 이라는 가로줄 div를 만들고 새로 4라는 새로운 객체를 추가해서 보여준다면 리액트는 다시 처음부터 1,2,3,4 이렇게 재렌더링을 한 후에 보여주지만 key값으로 고유성을 부여하게 되면 바로 4만 새로 추가해 렌더링하여 보여주기 때문이다. 즉 key는 각 배열 인자에 고유성을 심어 변화가 생기는 부분만 찾아 항..
React
2024. 1. 10. 16:46