React的对话框组件,父组件传visible, 子组件关闭时如何修改父组件的visible

#1

react的对话框组件,父组件(App)传visible, 子组件(Modal)关闭时如何修改父组件的visible, 不能传回调函数

class App extends Component {
  constructor () {
    super()
    this.state ={
      visible: false
    }
  }
  render() {
    return (
      <div className="App">
         <Modal visible={this.state.visible}></Modal>
      </div>
      
    );
  }
}

有大神给个思路吗?谢谢

#2

不可已吧, react又没有想vue的v-model~

#3

传一个钩子函数给子组件，()=>{this.setState({visible:false})},在子组建里调用

1 Like
#4

这两个想要沟通，需要一个桥梁，方案1：props传入方法修改；方案2：如果有redux库，子组件接入修改visible的值就行。方案3：如果不想为了这一点接入redux，可以自己加个事件监听，父组件监听onVisbleChange事件，在子组件内触发。

#5

父组件写个方法 const changeState=(state)=>{
this.setState({
visible:state
})
}

在子组件掉这个方法