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

请检查您是否正确呈现应用程序。

请参阅此工作示例：Codepen

Answer 2

为容器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

谷歌地图反应没有出现

2 个答案: