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

Question

我目前正在尝试像这样使用 react-native-modal 创建模态对象

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

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

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

以防万一这是我在 class

中的 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。

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

Creating Modal Object need help dealing with isVisible state

react-native

state

react-native-modal