Question

import React from 'react';
import { View, Text, Modal, Image, Button, StyleSheet } from 'react-native';

const ModalBox = props => {
    let ModalContent = null;
    if (props.selectedPlace) {
        ModalContent = (
            <View>
                <Image source={props.selectedPlace.image} style={styles.image} ></Image>
                <Text style= {styles.text}>{props.selectedPlace.value}</Text>
            </View>
        )
    }
    return (
        <Modal onRequestClose={props.close} visible={props.selectedPlace !== null} animationType="slide">
            <View style={styles.ModalContainer}>
                {ModalContent} 
                <Button title="Delete" color="red" onPress={props.itemDelete}></Button>
                <Button title="Close" onPress={props.close}></Button>
            </View>
        </Modal>
    )
}

const styles = StyleSheet.create({
    ModalContainer: {
        marginTop: 10
    },
    image: {
        height:200,
        width: "100%"
    },
    text:{
        textAlign:"center",
        fontWeight:"bold",
        fontSize: 28
    }
})

export default ModalBox;

我有上面的Modal代码。当我打开模态，然后在我的代码中进行一些更改，然后重新加载它时。 Modal挂断，甚至无法单击我的按钮并重新加载应用程序。我必须关闭我的应用程序，然后重新开始。

Answer 1

问题不在于您的代码，而在于React Native Modal itself。它已经出现在多个发行版中。最著名的解决方法是使用像react-native-navigation这样的具有自己的模式实现的库。

React-Native Modal挂断

1 个答案: