Question

每当我将浏览器屏幕缩小到960px以下时，地图都不会显示问题，它也不会在移动设备中显示。我不知道为什么会这样。我的Google Map组件代码如下。（我的键是正确的，因为它在大屏幕上显示）

import React, {Component} from 'react';
import { compose, withProps } from "recompose";
import { withScriptjs, withGoogleMap, GoogleMap, Marker } from "react-google-maps";

class MyGoogleMap extends Component{

  render(){

    const defaultMapOptions = {
       fullscreenControl: false,
       disableDefaultUI: true,
    };

  const MyMapComponent = withScriptjs(withGoogleMap((props) =>
  <GoogleMap
    defaultZoom={10}
    defaultCenter={{ lat: -37.810481, lng: 144.960655 }}
    defaultOptions={defaultMapOptions}
  >
    {props.isMarkerShown && <Marker position={{ lat: -37.814455, lng: 144.963315 }} />}
  </GoogleMap>
))


    return(
      <MyMapComponent
        isMarkerShown
        googleMapURL="https://maps.googleapis.com/maps/api/js?key=&?v=3.exp&libraries=geometry,drawing,places"
        loadingElement={<div style={{ height: `100%` }} />}
        containerElement={<div style={{ height: `200px` }} />}
        mapElement={<div style={{ height: `100%` }} />}
      />
    )
  }
}

export default MyGoogleMap;

屏幕尺寸小于960时，“ react-google-maps”地图不显示

0 个答案: