将值从灯箱传递给父级答案

【问题标题】：Passing value from lightbox to parent将值从灯箱传递给父级
【发布时间】：2018-11-11 09:39:38
【问题描述】：

我正在为我的应用中的用户创建个人资料屏幕。我正在使用 wix 的 React-Native-Navigation 的灯箱来执行编辑配置文件。因此，用户将点击 touchableopacity 并弹出一个灯箱，用户将输入新信息并保存。所以，我想知道是否可以将文本输入值从灯箱传递给父级（profile.js），以便我可以在 profile.js 中设置状态？

【问题讨论】：

标签： reactjs react-native react-native-navigation wix-react-native-navigation

【解决方案1】：

是的，这是可能的。您需要将数据作为道具发送给父级。如果你之前没有做过，可能会觉得有点棘手，但你会做到的。

来自父母：

<LightboxComponent 
  userData={this.handleUserData(data)}
/>

handleUserData(data) {
  /* Do something with the data here */
}

来自孩子：

要发送数据，您需要在要捕获的输入上设置 onChange 事件或类似事件，如下所示：

<input name="user-name" onChange={ (e) => this.props.userData(e.target.value) }

这将使来自子级的输入数据发送给父级。每次更改都会触发受影响组件的重新渲染。

如果您的应用抱怨无法正确设置状态，那么您需要在父构造函数中绑定 this，如下所示：

this.handleUserData = this.handleUserData.bind(this);

【讨论】：

您好，感谢您的回复。我正在使用此代码启动灯箱： Navigation.showLightBox({ screen: 'TFH.EditBox', passProps: { type:"Email", value:this.state.profile.email },

【解决方案2】：

我还要说将父函数指针作为道具传递给子函数（如 React 网站上所见）。尽管有些人选择使用事件发射器。我真的很好奇更多开发人员对此的看法。

是否以 StackOverflow 为由破坏了一个线程以进行史诗般的否决投票？

【讨论】：