react父子组件传值。

Question

1. 父组件： <AddEditModal data={this.state}></AddEditModal> ---点击时设置data:{visible:true}
2. 子组件： <Modal visible={this.state.visible}><p>Some contents...</p></Modal> ---子组件默认state：{ visible: false, }

问题： ①子组件如何获取data中visible，并将自身的this.state.visible置为true，从而打开modal框；
② 在子组件中可以使用this.setState方法，将自身的visible置false，从而关闭modal框么？

Answer 1

对react而言 是自上而下的。 所以 子组件的visible应该直接由父组件控制，而不是子组件持有一个state。

Answer 2

父子组件可以传值 也可以执行方法 但是你这个只是想打开关闭子组件？ 如果是这样写不是很麻烦么
1 你可以直接在父组件中执行子组件中的方法 可以this.state.visible=this.props.visible
2 子组件上加 parent={this} 这样子组件获取到父组件 可以执行父组件的方法 this.props.parent.method

Answer 3

其实完全没必要在子组件里控制自己的显示隐藏...你在父组件里用state控制是否渲染这个子组件就可以了...