React Leaflet V3

[abewartech]

Uncaught TypeError: Class extends value undefined is not a constructor or null
at Module../node_modules/react-leaflet-search/lib/ReactLeafletSearch.js

[debonx]

Any news about V3 integration?

[AndrejGajdos]

+1

[tnanhpt]

+1

[dtropp]

+1

[mrShahsafi]

'MapControl' is not exported from 'react-leaflet'.

[matburnham]

I started looking into this, but it's not as trivial as I first thought.

It looks like the new way of doing things is that react-leaflet-search needs to be a Child component. Child components can only be used as descendants of a MapContainer component. As-in, a descendant in HTML tag terms, not inheritance.

So, one could inherit from a Component rather than a MapControl. But then you need to get access to the Leaflet map object, which seems to be via a useRef hook (https://react-leaflet.js.org/docs/api-components#referenceable-behavior) unless there's another way. You'd also need to reimplement the (small amount of) location logic in the original MapControl class.

There's likely a bit more to it than that, so I'm parking this for my use-case for now, as I've ended up six levels deep trying to fix a different issue...

[pranav-ted]

https://codesandbox.io/s/search-box-implementation-in-react-leaflet-v310-forked-ouezc?file=/src/MapWrapper.jsx

[mrShahsafi]

thanks @pranav-ted

[Gabriel-Almeida-Ajax]

thanks @pranav-ted

[SalahAdDin]

https://codesandbox.io/s/search-box-implementation-in-react-leaflet-v310-forked-ouezc?file=/src/MapWrapper.jsx

It does not include all the options we have here and it also is weak on types.

[socketopp]

Any progress on this?

export 'MapControl' (imported as 'MapControl') was not found in 'react-leaflet' (possible exports: AttributionControl, Circle, CircleMarker, FeatureGroup, GeoJSON, ImageOverlay, LayerGroup, LayersControl, MapContainer, Marker, Pane, Polygon, Polyline, Popup, Rectangle, SVGOverlay, ScaleControl, TileLayer, Tooltip, VideoOverlay, WMSTileLayer, ZoomControl, useMap, useMapEvent, useMapEvents)

ERROR in ./node_modules/react-leaflet-search/lib/Search-v2.js 3:15-26
export 'withLeaflet' (imported as 'withLeaflet') was not found in 'react-leaflet' (possible exports: AttributionControl, Circle, CircleMarker, FeatureGroup, GeoJSON, ImageOverlay, LayerGroup, LayersControl, MapContainer, Marker, Pane, Polygon, Polyline, Popup, Rectangle, SVGOverlay, ScaleControl, TileLayer, Tooltip, VideoOverlay, WMSTileLayer, ZoomControl, useMap, useMapEvent, useMapEvents)