React 父/子窗体参数传递
1.父窗体
import Modal from './Modal' onModalRef = ref => { this.modal = ref }
onCallback = msg => {
console.log("父窗体收到消息", msg)
}
<Button onClick={ this.modal.setValue('来自父窗体的问候')}>父窗口传参给子窗口</Button>
<Modal onRef={this.onModalRef} onCallback={this.onCallback} />
2.子窗体
class Modal extends PureComponent {
constructor(props) {
super(props)
// 一定要有,不然父窗体调用会出现异常,调用失败
props.onRef(this)
this.state = {
msg: '',
}
}
setParentValue = (msg) => {
const { onCallback } = this.props
onCallback('子窗体传参给父窗口') }
setValue = (msg) => {
// setState是异步更新,会存在延迟
this.setState(msg)
console.log('子窗口收到参数', msg)
}
}
<a onClick={this.setParentValue}>子窗体传参给父窗口</a>