React Components之间的通信方式了解下 (4)

通过生命周期，子元素可以很容易的获取到父元素的内容，但是父元素如何获得来自子元素的内容呢？我们不要忘记了他们为一个沟通桥梁props！我们可以在父元素中创建一个方法用于获取子元素的信息，然后绑定到子元素上，然后不就可以获取到了！操作如下所示：

receiveFormChild=(value)=>{ console.log(value) } render() { return( <div> {this.state.num===2?"":<App1 num={this.state.num} popToFather={this.receiveFormChild}/>} <button onClick={this.addNum}>点我+1</button> </div> ) }

当子元素运行popToFather的时候，消息就可以传给父亲啦！

子元素：

render() { return( [ <p>{this.props.num}</p>, <button onClick={()=>this.props.receiveState("来自子元素的慰问")}>子传父</button> ] ) }

父元素成功获取来自子元素的慰问！

这次就科普到这里吧。