组件 A 是一个带有"确定"按钮的弹出对话框。 组件 B 是文本标签。
A 和 B 都是从其公共父组件 C 呈现的，但它们不会相互调用。
每当按下组件 A 上的"确定"按钮时，我都希望组件 B 上的文本发生变化。我们可以在 React 中使用什么样的状态传递机制来实现这种情况？
我没有使用Redux。
组件C
- 在公共父组件中声明状态
state={
text:''
}
- 声明一个函数，该函数接受参数并将其设置为上面声明的状态
clickHandler=(payload)=>{this.setState({text:payload})}
- 将函数传递给要从中获取值的组件
<ComponentB clickHandler={this.clickHandler}>
- 将状态传递给组件 A
<ComponentA text={this.state.text}>
构成部分B
- 在相应的事件处理程序中调用上面声明的函数，并将要获取的文本作为参数传递给对等组件
<button onClick={()=>this.props.clickHandler('text I want to pass')}>
组件 A
- 将收到文本作为
this.props.text