警告:遇到两个具有相同密钥的子项，`0`
警告:遇到两个具有相同密钥的子项，`0`
提问于 2018-06-04 05:10:18
我正在尝试映射一个数组，并在表项中显示我想要的内容。它要求我提供一个唯一的键，所以我选择了下面的代码，因为我在另一个组件中使用了它。我很好奇为什么它不能在这里工作。
renderData() {
const { aminos } = this.props.aminos;
return aminos.map((micro, i) => {
return (
<Table>
<tbody>
<tr>
<th scope="row">1</th>
<th key={i}>{micro.name}</th>
</tr>
<tr>
<td key={i}>{micro.serum.current}</td>
<td key={i}>{micro.serum.prev}</td>
<td key={i}>{micro.serum.ref}</td>
</tr>
</tbody>
</Table>
)
}回答 1
Stack Overflow用户
回答已采纳
发布于 2018-06-04 05:15:32
钥匙应该放在最外面的组件上。
return aminos.map((micro, i) => {
return (
<Table key={i}>
<tbody>
<tr>
<th scope="row">1</th>
<th >{micro.name}</th>
</tr>
<tr>
<td>{micro.serum.current}</td>
<td>{micro.serum.prev}</td>
<td>{micro.serum.ref}</td>
</tr>
</tbody>
</Table>
)
}尽管此映射将显示多个表，但也不确定这是否为您所希望的效果。另外，使用索引作为键也不是一个好主意，您应该使用某种唯一的id，比如数据库中的主键。
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/50671000
复制相关文章
相似问题
腾讯云开发者
