Google Map React not appearing

Question

我正在尝试使用google-map-react，但是当我尝试渲染它时，什么也不会出现。我想念什么吗？

import GoogleMap from 'google-map-react';
import React, { Component } from 'react';
class GMaps extends Component {

static defaultProps = {
    center: {lat: 59.95, lng: 30.33},
    zoom: 11
  };
render() {
  return (
   <div>
    <GoogleMap
       style={{width: "100%", height: "500"}}
       defaultCenter={this.props.center}
       defaultZoom={this.props.zoom}
     />
   </div>
  )
} 

}

Answer 1

将高度和宽度分配给容器div填充，将解决问题

<div style={{ height: '100vh', width: '100%' }}>
<GoogleMapReact
   defaultCenter={this.props.center}
   defaultZoom={this.props.zoom}
 />
</div>

如开始：https：//www.npmjs.com/package/google-map-react

Answer 2

请检查您是否正确渲染了该应用程序。

请参阅此工作示例：Codepen