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

생글탱글님의 프로필 이미지
생글탱글

작성한 질문수

React로 NodeBird SNS 만들기

6-5. Link 컴포넌트 고급 사용법

콘솔에러가 나요ㅠㅠ

작성

·

239

0

Warning: Encountered two children with the same key, `[object Object]`. Keys should be unique so that components maintain their identity across updates. Non-unique keys may cause children to be duplicated and/or omitted — the behavior is unsupported and could change in a future version.

이렇게 오류가 납니다. 다른분 질문을 보니 key에서 createdAt이 문제인 것 같은데 어떻게 수정을 해야할 지 모르겟습니다ㅠ

return (
<div>
<Card
key={+post.createdAt}
cover={post.img && <img alt="example" src={post.img} />}
actions={[
<Icon type="retweet" key="retweet" />,
//////////////////////////
PostCard.propTypes = {
post: PropTypes.shape({
User: PropTypes.object,
content: PropTypes.string,
img: PropTypes.string,
createdAt: PropTypes.object,
}),
};

답변 5

0

제로초(조현영)님의 프로필 이미지
제로초(조현영)
지식공유자

 지금 Card쪽을 보고계신데 Card가 아니라 PostCard를 보셔야 합니다. PostCard가 쓰이는 곳이요.

0

생글탱글님의 프로필 이미지
생글탱글
질문자

맞는 것 같아요...

---> index.js:1 Warning: Failed prop type: Invalid prop `post.createdAt` of type `string` supplied to `PostCard`, expected `object`.

    in PostCard (at pages/index.js:23)

---> index.js:1 Warning: Encountered two children with the same key, `[object Object]`. Keys should be unique so that components maintain their identity across updates. Non-unique keys may cause children to be duplicated and/or omitted — the behavior is unsupported and could change in a future version.


PostCard.propTypes = {
post: PropTypes.shape({
User: PropTypes.object,
content: PropTypes.string,
img: PropTypes.string,
createdAt: PropTypes.object,
}),
};

0

제로초(조현영)님의 프로필 이미지
제로초(조현영)
지식공유자

에러메시지의 위치가 Card가 맞나요??

0

생글탱글님의 프로필 이미지
생글탱글
질문자

createdAt 2020-04-12T08:32:59.000Z

PostCard.js:39 createdAt 2020-04-12T08:32:01.000Z

PostCard.js:39 createdAt 2020-04-10T07:20:10.000Z

PostCard.js:39 createdAt 2020-04-10T07:20:00.000Z

PostCard.js:39 createdAt 2020-04-10T07:04:42.000Z

전부 다른 값이 나옵니다.

그리고  post.id로 했는데도 같은 에러가 나요ㅠㅠ

Warning: Encountered two children with the same key, `[object Object]`. Keys should be unique so that components maintain their identity across updates. Non-unique keys may cause children to be duplicated and/or omitted — the behavior is unsupported and could change in a future version.

<Card
key={+post.id}
cover={post.img && <img alt="example" src={post.img} />}
actions={[

0

제로초(조현영)님의 프로필 이미지
제로초(조현영)
지식공유자

위에서 console.log('createdAt', post.createdAt)을 먼저 해서 값을 확인해보세요. 고유하기만 하면 되므로 post.id 이런 고유값이 더 낫습니다.

생글탱글님의 프로필 이미지
생글탱글

작성한 질문수

질문하기