抽屉屏幕内部的全屏地图导致抽屉项目按下时滞

Question

因此，我目前正在开发一个应用程序，该应用程序需要一个带有多个屏幕的抽屉，其中一个是地图。最大的问题是，当我打开抽屉并导航到另一个屏幕时，由于地图难以渲染，因此体验非常缓慢。我想要做的是添加一些事件侦听器或使用一些导航道具来渲染或不渲染地图，但是react-navigation事件侦听器（“ didBlur”，“ didFocus”等）没有帮助。有什么想法吗？

import React from 'react';
import { View, TouchableOpacity, SafeAreaView } from 'react-native';
import MapView, { PROVIDER_GOOGLE } from 'react-native-maps';
import { Icon } from 'native-base';

class HomeScreen extends React.Component {
    static navigationOptions =
        {
            drawerIcon: <Icon name="map" style={{ fontSize: 25 }} />,
            title: "Acasa"
        }
    render() {
        return (
            <MapView
                style={{ flex: 1, zIndex: 101 }}
                provider={PROVIDER_GOOGLE}
                region={{
                    latitude: 47.141515,
                    longitude: 27.565993,
                    latitudeDelta: 0.0922,
                    longitudeDelta: 0.0421,
                }}
            >
                <Icon name="menu" style={{ position: 'absolute', marginTop: 35, marginLeft: 15, fontSize: 50 }} onPress={() => {
                    this.setState({ isMapVisible: false })
                    this.props.navigation.openDrawer()
                }} />
            </MapView>

        )
    }
}

export default HomeScreen;