react-native - 创建模态对象需要帮助处理 isVisible 状态

Question

我目前正在尝试使用这样的 react-native-modal 创建一个 Modal 对象

const ModalExample = (props) => {
    return (
        <Modal isVisible={props.isVisible}>
               <Text>Hello!</Text>
               <Button title="Hide modal" onPress={this.setModalVisibility} />
        </Modal>
    )
}

问题是 onPress 应该将状态从 true 更改为 false，但无法访问类中的状态。这是初始化模式的按钮以及我如何调用对象：

<Button title="Show modal" onPress={this.setModalVisibility} />
<ModalExample isVisible={this.state.modalVisible}/>

并且只是以防万一这是我在课堂上的 setModalVisibility

setModalVisibility = () =>{
     this.setState({modalVisible: !this.state.modalVisible})
}

谢谢你的帮助

Answer 1

您还需要传递函数，

<ModalExample isVisible={this.state.modalVisible} setModalVisibility={this.setModalVisibility}/>

以模态调用该函数，

const ModalExample = (props) => {
    return (
        <Modal isVisible={props.isVisible}>
             <Text>Hello!</Text>
             <Button title="Hide modal" onPress={props.setModalVisibility} />
        </Modal>
    )
}

注意：您无权访问this功能组件。