javascript - 将this.props.functionName()的结果传递回父级

在React JS中，我有2个文件：

文件1：Chat.js

该文件调用了许多自定义组件，并为它们提供了自定义功能作为道具。

文件2：PreviewChatBox.js

此文件显示多个聊天的预览。当我调用从chat.js发送的函数（加载Chat）时，它将Chat.js中的状态从Previewchat组件之一更改为整数。

我需要能够访问Chat.js中的该组件，但似乎无法将变量传递回去。

码：

文件1：Chat.js

render(){
  return(
    <PreviewChatBox onClicked={() => this.previewClicked()}/>
)}

文件2：PreviewChatBox.js

 <div onClick={() => this.props.onClicked()} key={value}>
     <p> {element[0]}{element[1]}{element[2]} </p>
 </div>

因此，我可以毫无问题地调用该方法，但无法将密钥传递回chat.js

最佳答案

您是否考虑过使用回调函数？

Chat.js

<PreviewChatBox
     onClicked={() => this.previewClicked()}
     updateKey((newKey) => this.setState({newKey}) />

现在，您的子组件应该可以通过从props访问updateKey函数来更新Chat.js的状态。

关于javascript - 将this.props.functionName()的结果传递回父级，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/47818166/