如果我使用按钮而不是它，则无法执行 TouchableOpacity 或 TouchableHighlight 的 onPress 它可以工作我做错了什么？

Question

我创建了一个 MyAlertBox.js 文件。使用如下所示进行测试。

render() {
       return (
               <MyAlertBox title="Testing" message="Worked?" show={true} />
       );
     }

里面 Home.js。 MyAlertBox 如下所示。

export default class MyAlertBox extends Component {
    constructor(props) {
        super(props);
        this.state = {
            Alert_Visibility: props.show,
            showme: props.show
        };
    }

    ok_Button (){
        this.setState({showme:false,Alert_Visibility:false});
    }

    render() {
        if (!this.state.Alert_Visibility)
            return (<View><Text>Suppose to be alertbox.</Text></View>);
        else
            return (
                <View style={styles.MainContainer}>
                    <Modal
                        visible={this.state.Alert_Visibility}
                        transparent={true}
                        animationType={"fade"}
                        onRequestClose={() => { console.warn('closing.');this.Show_Custom_Alert(false)}} >

                        <View style={{ flex: 1, alignItems: 'center', justifyContent: 'center' }}>
                            <View style={styles.Alert_Main_View}>
                                <Text style={styles.Alert_Title}>{this.props.title}</Text>
                                <View style={{ width: '100%', height: 2, backgroundColor: '#fff' }} />
                                <Text style={styles.Alert_Message}> {this.props.message} </Text>
                                <View style={{ width: '100%', height: 1, backgroundColor: '#fff' }} />
                                <View style={{ flexDirection: 'row', height: '30%' }}>
                                    <TouchableOpacity
                                        style={styles.buttonStyle}
                                        onPress={this.ok_Button.bind(this)}
                                        activeOpacity={0.7}>
                                        <Text style={styles.TextStyle}> OK </Text>
                                    </TouchableOpacity>
                                    {/* <Button title="OK" onPress={this.ok_Button.bind(this)} /> */}
                                    <View style={{ width: 1, height: '100%', backgroundColor: '#fff' }} />
                                    <TouchableHighlight
                                        style={styles.buttonStyle}
                                        onPress={this.ok_Button.bind(this)}
                                        activeOpacity={0.7} >
                                        <Text style={styles.TextStyle}> CANCEL </Text>
                                    </TouchableHighlight>
                                    {/* <Button title="CANCEL" onPress={this.ok_Button.bind(this)} /> */}
                                </View>
                            </View>
                        </View>
                    </Modal>
                </View>
            );
    }
}

此处显示警告框但无法单击 'OK' 或 'cancel' 如果我将 TouchableOpacity 或 TouchableHightlight 更改为按钮，它会被调用并且工作正常。我做错了什么？

请指教。谢谢

Answer 1

确保从正确的包中导入 Touchable。我从“react-native-gesture-handler”导入了 class，它应该是“react-native”。代码没问题

如果我使用按钮而不是它，则无法执行 TouchableOpacity 或 TouchableHighlight 的 onPress 它可以工作我做错了什么？

Unable to execute onPress of TouchableOpacity or TouchableHighlight if I use button instead it works what am I doing wrong?

alert

button

react-native

touchableopacity