Question

我有一个相当标准的数组：

["value","value","value"]

如果我想迭代它，每个列表项都需要一个唯一的键。但是在这种情况下我该怎么办呢？

JSON通常带有id - 但在这种情况下我没有任何id，并且值也不是唯一的，所以我不能只使用它们作为键。

{someArray.map(object => {
                return (<span key=???> {object} </span>); })}

Answer 1

每个列表项都需要一个唯一的密钥

它并不是真的。我觉得React的警告非常过分。只有在需要更好的性能时才需要使用唯一键，我相信还有一些关于维护组件状态的东西。值得注意的是，如果你做dom.div(null, ["text"])，你会收到警告，但是如果你做dom.div(null, ...["text"])，你将不会收到任何警告，尽管在这两种情况下都传递了相同的数组。在后一种情况下，React只使用索引作为键，在前一种情况下也完全正常，但React没有真正的原因警告它。

如果渲染函数是无状态的并且您不需要更好的性能，只需在数组中给它们一个索引键以使警告静音，或者使用扩展运算符。

Answer 2

您可以使用map的第二个参数，索引：

{someArray.map((object, i) => {
                return (<span key={i}> {object} </span>); })}

只要someArray在组件的生命周期内保持不变，这就没问题;如果没有，当你移动，插入或移除物品时，它会导致更多的重新渲染，因为孩子的所有道具都会改变。（但在这种情况下，你根本不会注意到它）

如何在没有id的React中映射数组？

2 个答案: