世博会Google地图灰色区域android模拟器

Question

我真的是React-native的新手。我使用expo创建了我的应用。我想在iso和android模拟器中渲染Google地图。我已经为该应用安装了react-native-maps软件包。我添加了google-api世博会的app.json。但是问题是，地图在Android模拟器中显示为灰色，但在iso模拟器中却可以工作。我不知道如何解决它。

这是我的app.json文件

{
  "expo": {
    "name": "first app",
    "slug": "first-app",
    "version": "1.0.0",
    "orientation": "portrait",
    "icon": "./assets/icon.png",
    "splash": {
      "image": "./assets/splash.png",
      "resizeMode": "contain",
      "backgroundColor": "#ffffff"
    },
    "updates": {
      "fallbackToCacheTimeout": 0
    },
    "assetBundlePatterns": [
      "**/*"
    ],
    "web": {
      "favicon": "./assets/favicon.png"
    }
  },
  "android": {
    "config": {
      "googleMaps": {
        "apiKey": "AIzaSyCdPV0....."
      }
    }
  },
  "ios": {
    "config": {
      "googleMaps": {
        "apiKey": "AIzaSyCdPV0....."
      }
    }
  }
}

这是我的地图组件

import React from 'react';
import MapView, { PROVIDER_GOOGLE } from 'react-native-maps';
import { StyleSheet, Text, View, Dimensions } from 'react-native';

export default class App extends React.Component {
  render() {
    return (
      <View style={styles.container}>
        <MapView
          provider={PROVIDER_GOOGLE}
          initialRegion={{
            latitude: 60.1098678,
            longitude: 24.7385084,
            latitudeDelta: 0.2,
            longitudeDelta: 1,
          }}
          style={styles.mapStyle} />
      </View>
    );
  }
}


const styles = StyleSheet.create({
  container: {
    flex: 1,
    backgroundColor: '#fff',
    alignItems: 'center',
    justifyContent: 'center',
  },
  mapStyle: {
    width: 400,
    height: 400,
  },
});