大多数基本的 react-native-maps 不起作用（Expo）答案

【问题标题】：Most basic react-native-maps not working (Expo)大多数基本的 react-native-maps 不起作用（Expo）
【发布时间】：2020-03-15 14:39:08
【问题描述】：

我正在尝试让最基本的地图显示在我的 react 本机应用程序中，但它只是显示一个空白屏幕。这是我的代码...

import React from 'react';
import {
    StyleSheet,
    Text,
    View,
    Image,
    Button
} from 'react-native';

//Import map
import MapView from 'react-native-maps';


class TodaysJobs extends React.Component {
    render() {
        return (
            <MapView
                initialRegion={{
                  latitude: 37.78825,
                  longitude: -122.4324,
                  latitudeDelta: 0.0922,
                  longitudeDelta: 0.0421,
                }}
            />
        );
    }
}

export default TodaysJobs;

const styles = StyleSheet.create({
    logo: {
        width: '60%',
        resizeMode: 'contain'
    },
    navButton: {
        width: '60%',
        marginTop: 20,
        flex: 1
    }
});

如果我尝试使用import { MapView } from 'react-native-maps';，则会收到此错误...

警告：React.createElement：类型无效 - 需要一个字符串（对于内置组件）或一个类/函数（对于复合组件）但得到：%s.%s%s，未定义，您可能忘记了从定义组件的文件中导出组件，或者您可能混淆了默认导入和命名导入。

我的 app.json API 如下所示：

"android": {
        "config": {
            "googleMaps": {
                "apiKey": "MYAPIKEYkmdsa;jfpjP(pJPOEFKm;"
            }
        }
    }

【问题讨论】：

标签： reactjs expo native

【解决方案1】：

我知道我很笨但该死。抱歉我的样式没有设置....

mapStyle: {
    width: Dimensions.get('window').width,
    height: Dimensions.get('window').height,
},

【讨论】：