title: Using react-leaflet-geosearch in React Leaflet: cannot read property addControl
body: <p>Trying to add react-leaflet-geosearch to my leaflet map and I get the error:</p>
  <blockquote>
  <p>Cannot read property 'addControl' of undefined</p>
  </blockquote>
  <p>I do not know what the problem seems to be:</p>
  <p>My code:</p>
  <pre><code>render() {
      const prov = OpenStreetMapProvider();
      const GeoSearchControlElement = SearchControl;
      return (
        &lt;&gt;
         
           
            &lt;MapContainer
              style={{ height: &quot;100%&quot;, width: &quot;100%&quot; }}
              center={position}
              zoom=&quot;0&quot;
              scrollWheelZoom={true}
            &gt;
              &lt;TileLayer
                attribution='&amp;copy; &lt;a href=&quot;http://osm.org/copyright&quot;&gt;OpenStreetMap&lt;/a&gt; contributors'
                url=&quot;https://api.mapbox.com/styles/v1/&lt;style&gt;/tiles/256/{z}/{x}/{y}@2x?access_token=&lt;token&gt;&quot;
              /&gt;
              &lt;Marker position={position} &gt;&lt;/Marker&gt;
              &lt;ChangeMapView coords={position} /&gt;
              &lt;GeoSearchControlElement
                provider={prov}
                showMarker={true}
                showPopup={false}
                popupFormat={({ query, result }) =&gt; result.label}
                maxMarkers={3}
                retainZoomLevel={false}
                animateZoom={true}
                autoClose={false}
                searchLabel={&quot;Enter address, please&quot;}
                keepResult={true}
              /&gt;
            &lt;/MapContainer&gt;
          
        &lt;/&gt;
      );
  </code></pre>