如何从react google地图导入MarkerClusterer而不是require

npm install react-google-maps

import { GoogleMap, Marker, withGoogleMap, withScriptjs } from "react-google-maps";
import MarkerClusterer from "react-google-maps/lib/components/addons/MarkerClusterer";

<script src="https://maps.googleapis.com/maps/api/js?key=YOUR_API_KEY"></script>

const MapWithMarkerClusterer = withScriptjs(withGoogleMap((props) => (
  <GoogleMap
    defaultZoom={8}
    defaultCenter={{ lat: -34.397, lng: 150.644 }}
  >
    <MarkerClusterer
      averageCenter
      enableRetinaIcons
      gridSize={60}
    >
      {props.markers.map((marker, index) => (
        <Marker key={index} position={{ lat: marker.lat, lng: marker.lng }} />
      ))}
    </MarkerClusterer>
  </GoogleMap>
)));

// 在你的组件中使用MapWithMarkerClusterer组件
<MapWithMarkerClusterer
  googleMapURL={`https://maps.googleapis.com/maps/api/js?key=YOUR_API_KEY`}
  loadingElement={<div style={{ height: `100%` }} />}
  containerElement={<div style={{ height: `400px` }} />}
  mapElement={<div style={{ height: `100%` }} />}
  markers={[{ lat: -34.397, lng: 150.644 }, { lat: -35.297, lng: 149.644 }]}
/>