反应：将一个对象添加到数组中

Question

我是一个初学者，并且我想将一个对象添加到数组中。

这里是我的代码：

而且在我的组件：

<ul>{this.props.chat.messages.map((message) =>{ return <li>{message.text}</Link></li> }) 

}

而我得到的错误：

Encountered two children with the same key,的翻译：. Child keys must be unique; when two children share a key, only the first child will be used.

谢谢你的帮助。

Answer 1

您必须为每个列表项目提供unique keys。您的消息没有密钥/ ID，您需要提供唯一生成的ID或作为最后的手段，请使用索引（应该尽可能避免使用该索引）。上面的代码可以被重构为：

{ this.props.chat.messages.map((message, index) => (<li key={index}>{message.text}</li>) }