인프런 영문 브랜드 로고
인프런 영문 브랜드 로고

인프런 커뮤니티 질문&답변

sunarol님의 프로필 이미지
sunarol

작성한 질문수

한 입 크기로 잘라 먹는 리액트(React.js) : 기초부터 실전까지

8.5) Read - 투두리스트 렌더링하기

<DiaryItem key={it.id} {...it} /> 이렇게 key를 전달했지만 또 콘솔창에 key에러 문구가 나옵니다

작성

·

261

0




nodejsjavascriptreact

답변 1

0

이정환 Winterlood님의 프로필 이미지
이정환 Winterlood
지식공유자

안녕하세요

이정환입니다.

 

해당 오류는 아이템들간 중복된 key가 존재한다는 뜻 입니다.

오류만 보고는 현재 원인을 특정하기 힘듦으로 구체적인 해결방안을 원하신다면 코드샌드박스 '링크'를 통해 질문해 주시면 확인 해 보겠습니다

sunarol님의 프로필 이미지
sunarol
질문자

DiaryList.js에서

{diaryList.map((it) => (
          <div>
            <DiaryItem
              key={it.id}
              {...it}
              onEdit={onEdit}
              onRemove={onRemove}
            />
          </div>

를

{diaryList.map((it) => (
          <DiaryItem key={it.id} {...it} onEdit={onEdit} onRemove={onRemove} />

로 바꿨더니 해결되었는데 이게 key와의 상관관계가 어떻게 되나요?

sunarol님의 프로필 이미지
sunarol

작성한 질문수

전체 Q&A
질문하기