本地主机上的地图和标记没有显示白页@react-google-maps/api

Question

import React from 'react'
import { GoogleMap, Marker, useJsApiLoader } from '@react-google-maps/api';

const containerStyle = {
  width: '95%',
  height: '550px'
};

const center = {
  lat: 27.8103,
  lng: 70.4125
};
   
function Map(props) {
  const { isLoaded } = useJsApiLoader({
    id: 'google-map-script',
    googleMapsApiKey: "API KEY"
    
  })

  const [map, setMap] = React.useState(null)

  const onLoad = React.useCallback(function callback(map) {

    const bounds = new window.google.maps.LatLngBounds({
      lat: props.lat,
      lng: props.lng
    });
     
    map.fitBounds(bounds);

    setMap(map)
  }, [])

  const onUnmount = React.useCallback(function callback(map) {
    setMap(null)
  }, [])

  return isLoaded ? (
    
      <GoogleMap
        mapContainerStyle={containerStyle}
        center={center}
        zoom={20}
        onLoad={onLoad}
        onUnmount={onUnmount}>
        <></>
        <Marker onLoad={onLoad} position={center} />
        
      </GoogleMap>
  ) : <></>
}

export default Map

我尝试将标记固定到该位置，但由于标记未显示，地图现在未显示。完全空白的页面

Answer 1

使用 MarkerF 代替 Marker 获取更多信息Marker Issue