React：将状态从孩子传递到孩子再传递给父母答案

【问题标题】：React: Passing state from child to child to parentReact：将状态从孩子传递到孩子再传递给父母
【发布时间】：2018-06-29 01:43:32
【问题描述】：

我试图通过 2 个子元素将值传递给父元素。链条看起来像这样：

Child1 > Child2 > Parent

但是，我的父处理程序没有获取 Child1 中的值。我试图在父组件中控制台记录theString 的状态，但是没有显示任何内容。如何将处理函数传递给 child1 并获取其值以存储在状态中？

孩子 1

  <input ref="theString" type="string" onChange={this.props.handleChangeOfString} value={this.state.theString} />

子 2 组件

<Tab tabId="4">
   {this.props.nav4Content}
   {this.props.handleChangeOfString}
</Tab>

父构造函数：

constructor(props) {
    super(props);
    this.state = {
       theString: ''
    };
    this.handleChangeOfString = this.handleChangeOfString.bind(this);
}

父级组件：

<StringComponent
  nav4Content={colorsTab}
  onChange={this.handleChangeOfString}
/>

父处理程序：

handleChangeOfString(e) {
  this.setState({theString: e.target.value})
}

【问题讨论】：

标签： javascript html reactjs state jsx

【解决方案1】：

问题是您如何将道具从child2 传递到child1。您不是将值作为道具传递，而是作为 child2 组件中的 children 传递。改成

<Tab 
   tabId="4" 
   nav4Content={this.props.nav4Content} 
   handleChangeOfString={this.props.onChange}
/>

【讨论】：

这不是调用处理函数成功。我正在尝试注销处理程序中的更改，但没有任何内容传递给它。
你的child1组件是Tab，或者child1是如何从child2渲染出来的
我不得不像你说的那样重新设计我的组件并更新道具！