Add leaflet plugins to React-Leaflet
I finally solved the problem by using the map directly. This was even more convenient and gave me more freedom while adding interaction to the map. Simply define your map as following and use the map reference to perform any action:
<Map ref={Map => this.map = Map} ... > ...<Map>Now you can reference the map in any leaflet object using this.map.leafletElement defined by react-leaflet:
const polyline = L.polyline([p1,p2 ], {color: 'yellow'}).addTo(this.map.leafletElement);The above code will add a new line on the map.
polyline.remove(); => will remove the line from the map.
Yeah this used to be very straightforward with v1.x of react-leaflet
I've run into a similar extension problem and I've opened an issue on the react-leaflet github repo in the hopes that Paul will show us the way.https://github.com/PaulLeCam/react-leaflet/issues/506
For now downgrading to v1.9 works for me.