反應原生地圖無法正確顯示地圖

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

您需要將提供程序添加到 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>