我不确定如何将密钥传递给无状态react组件
MyComponent: (props) => {
return(<span>{props.somevalue}</span>);
}
aCollection.map((value,index)=> <MyComponent somevalue={value});
这样做将导致关键警告。
所以我试图通过props传递密钥
aCollection.map((value,index)=> <MyComponent key={index} somevalue={value});
MyComponent: (props) => {
return(<span key={this.props.key} >{props.somevalue}</span>);
}
但是我收到错误 https://facebook.github.io/react/warnings/special-props.html
我打算如何在无状态组件中传递/使用密钥？
由于错误表明(ref and key)React 使用的特殊props，因此不会转发到组件，因此您不能通过名称key和 yes传递props以消除警告，您需要定义键，因此只需重命名prop 将其发送到 MyComponent。另外我相信你必须在你的无状态组件中使用 prop，props.index而不是this.props.index.
aCollection.map((value,index)=> <MyComponent index={index} somevalue={value});
MyComponent: (props) => {
return(<span key={props.index} >{props.somevalue}</span>);
}
您只需要定义跨度的键，因此将其用作 key={props.index}. 它应该消除警告。
您可以尝试以下操作：
<React.Fragment key={item.id}>{SomeFunctionComponent(item)}</React.Fragment>
从文档：
使用显式语法声明的片段可能有键。
可以在这里找到