我共同面臨的Warning: Each child in an array or iterator should have a unique "key" prop
錯誤與我的道具組成部分,儘管設置了關鍵我陣列的unqiueID爲返回的div元素我看到這個警告的關鍵。我是否將它設置在錯誤的元素上?它可能與嵌套map
有關嗎?ReactJS - 缺少關鍵儘管在元
JSON實例:
{
annotationId: 117,
title: "Test",
discovery: "Test 123",
annotation_comments: [{
annotationCommentId: 12,
comment: "Lorem Ipsum"
}]
}
詳細的錯誤:
in AnnotationCard (created by AnnotationFeed)
in AnnotationFeed (created by AnnotationFeedContainer)
in div (created by AnnotationFeedContainer)
in AnnotationFeedContainer (created by Annotation)
in div (created by Annotation)
in Annotation
組件:
//Loop through JSON and component
const AnnotationFeed = props => {
return (
<div>
{
props.annotations.map((annotation, index) => {
return (
<AnnotationCard {...annotation}>
{ annotation.annotation_comments.map((comment, i) => <Comments {...comment} />)}
</AnnotationCard>
);
})
}
</div>
)
}
const AnnotationCard = props => {
return (
<div key={props.annotationIdHash}>
<h4>{props.title}</h4>
<p>{props.discovery}</p>
</div>
)
}
const Comments = props => {
return (
<div key={props.annotationCommentId}>
<h4>{props.comment}</h4>
</div>
)
}
你沒有設定一個關鍵道具 – linasmnew