反应本机地图无法正确显示地图

Question

我已经在我的应用程序中安装了react-native-maps，但是当我输入MapView时，这是输出：

我遵循了github上的安装指南，并输入了api密钥，但仍然没有显示任何内容。

这是代码：

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

import MapView from 'react-native-maps';


export default class App extends Component {
  render() {
    return (
      <View style={styles.container}>
       <MapView
         style={styles.map}
         region={{
           latitude: 41.89193,
           longitude: 12.51133,
           latitudeDelta: 0.015,
           longitudeDelta: 0.0121,
         }}
       >
       </MapView>
     </View>
    );
  }
}

const styles = StyleSheet.create({
 container: {
   ...StyleSheet.absoluteFillObject,
   height: 400,
   width: 400,
   justifyContent: 'flex-end',
   alignItems: 'center',
 },
 map: {
   ...StyleSheet.absoluteFillObject,
 },
});

有人知道我如何解决这个问题，或者它取决于什么？ 谢谢

Answer 1

您需要像这样将 provider 添加到MapView：

import MapView, { PROVIDER_GOOGLE } from 'react-native-maps';
....
<MapView
     provider={PROVIDER_GOOGLE}
     style={styles.map}
     region={{
       latitude: 41.89193,
       longitude: 12.51133,
       latitudeDelta: 0.015,
       longitudeDelta: 0.0121,
     }}
   >
</MapView>