javascript - 标题中的 ReactNativeElements 按钮在 iPhone 上不可点击。（剩下）

Question

我目前正在做一个世博会项目。我在顶部有一个 Header 组件，左侧有一个 TouchableOpacity 组件。这在 Android 和 iPadOS 上都是可点击的。但在任何 iPhone 上，按钮都不可点击。知道这怎么会发生吗？

示例组件：

import React, { Component } from 'react';
import { StyleSheet, Text, View } from 'react-native';
import MenuButton from '../components/MenuButton';
import Layout from '../constants/Layout';
import { Header } from 'react-native-elements';
import { withTheme } from '../classes/themeProvider';

class TestScreen extends Component {
    constructor(props) {
        super(props);
        this.state = {};
    }

    render() {
        return (
            <View style={[styles.container, { backgroundColor: this.props.theme.appBackground }]}>
                <Header
                    leftComponent={<MenuButton navigation={this.props.navigation} />}
                    centerComponent={{
                        text: 'Test',
                        style: {
                            color: this.props.theme.tabBarText,
                            fontSize: Layout.headerTextSize,
                        },
                    }}
                    containerStyle={{
                        backgroundColor: this.props.theme.tabBar,
                        borderBottomWidth: 0,
                    }}
                />
                <Text style={{ color: this.props.theme.lightTextColor, margin: 10 }}>
                    Bald verfügbar!
                </Text>
            </View>
        );
    }
}

export default withTheme(SecuronScreen);

const styles = StyleSheet.create({
    container: {
        flex: 1,
    },
});

菜单按钮如下所示：

import React from 'react';
import { TouchableOpacity} from 'react-native';
import {Icon} from "react-native-elements";
import {withTheme} from "../classes/themeProvider";

class MenuButton extends React.Component {
    render() {
        return (
            <TouchableOpacity
                onPress={() => this.props.navigation.toggleDrawer()}
            >
                <Icon
                    name='menu'
                    color={this.props.theme.tabBarText}
                />

            </TouchableOpacity>
        );
    }
}

export default withTheme(MenuButton);

标签： javascriptreact-nativejsx