search

JustFly1984 / react-google-maps-api

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

Marker Clusterer type error when an array of Markers are provided #3259

Closed OrcunGuler1 closed 1 year ago

OrcunGuler1 commented 1 year ago

When using <MarkerClusterer/> component the array of <Markers/> that are passed in to the clusterer give the following error 

No overload matches this call.
  Overload 1 of 2, '(props: Readonly<MarkerClustererProps>): ClustererComponent', gave the following error.
    Type 'Element[]' is missing the following properties from type 'ReactElement<any>': type, props, key
  Overload 2 of 2, '(props: MarkerClustererProps, context?: any): ClustererComponent', gave the following error.
    Type 'Element[]' is not assignable to type 'Element'.ts(2769)

Environment

TypeScript V3.2.2

os: macOs Ventura 13.4

node --version 12.18.4

react version 16.14.0

webpack version 4.19.1

@babel version 7.1.6

@react-google-maps/api version 2.18.1

How does it behave?

The Marker components are given as an array of markers mapped over an external data source and gives a type error

How should it behave correctly?

Should accept the array of markers as given in marker use case example in the docs

Basic implementation of incorrect behavior in codesandbox.com

https://codesandbox.io/s/peaceful-swanson-2sr3km?file=/src/App.tsx

JustFly1984 commented 1 year ago

@OrcunGuler1 wrap it in <></>. repeated issue.