JustFly1984 / react-google-maps-api

React Google Maps API
MIT License
1.75k stars 421 forks source link

onLoad prop return type error, but the map loads correctly #3316

Open darlanZero opened 6 months ago

darlanZero commented 6 months ago

on the code of a map:

`const mapRef = useRef<GoogleMap | null>(null)

const center = useMemo(() => ({ lat: -19.947128, lng: -45.165717 }), [])

const options = useMemo(() => ({ mapId: 'd78eeda2034f463a', clickableIcons: false, }), [])

const onLoad = useCallback((map: GoogleMap) =>{ mapRef.current = map}, [])

return

Commute?

{ setOffice(position) mapRef.current?.panTo(position) }} />
Água Esgoto Outro Visível Enterrado Localidade 1 Localidade 2 Localidade 3
<div className="w-4/5 h-full">
  <GoogleMap
    zoom={15}
    center={center}
    mapContainerClassName="map-container"
    options={options}
    onLoad={onLoad}
    onClick={handleMapClick}
  >
    {office && (
      <>
        <Marker 
          position={office} 
          icon={defaultMarker} 
          title="location"
        />
      </>
    )}

     {markers.map((marker) => (
       <Marker 
          key={marker.id}
          position={marker.position}
          onClick={() => handleMarkerClick(marker)}
          icon={ativo}
       />
     ))}

     {selectedMarker && (
       <InfoWindow
        key={selectedMarker.id}
        position={selectedMarker.position}
        onCloseClick={handleMarkerClose}
       >
          <div>
            <h2>Editar nome de Ativo</h2>
             <Input 
                placeholder="Nome do ativo"
                value={inputValue}
                onChange={handleInputChange}
                type="text"
             />
          </div>
       </InfoWindow>
     )}
  </GoogleMap>
</div>

; }`

the onLoad keeps getting this error: No overload matches this call. Overload 1 of 2, '(props: GoogleMapProps | Readonly): GoogleMap', generated the following error. Type '(map: GoogleMap) => void' cannot be assigned to type '(map: Map) => void | Promise'. Types of parameters 'map' and 'map' are incompatible. Type 'Map' has no properties in common with type 'GoogleMap': state, registeredEvents, mapRef, getInstance, and 11 more. Overload 2 of 2, '(props: GoogleMapProps, context: any): GoogleMap', generated the following error. Type '(map: GoogleMap) => void' cannot be assigned to type '(map: Map) => void | Promise'.ts(2769) index.d.ts(78, 5): The expected type comes from property 'onLoad', which is declared here in type 'IntrinsicAttributes & IntrinsicClassAttributes & Readonly' index.d.ts(78, 5): The expected type comes from property 'onLoad', which is declared here in type 'IntrinsicAttributes & IntrinsicClassAttributes & Readonly'

I'm using the latest version of react-google-maps/api. My only choice is getting to the map a any, but it doesn't will deploy correctly with this error.