title: Map container is being reused by another instance
body: <p>What i want to do is after map initialization i have menu with cities names when i choose city the map should zoom in that city .</p>
  
  <p>expected results :
  after the page start with map initialized in the middle every time i choose city the map zoom in to that city .
  actual results
  The map starts in the middle  (initialized in the start )and when i choose the first city the map zooms in with no problems .when i try to choose another city i get this error (leaflet.js:5 Uncaught Error: Map container is being reused by another instance
      at i.remove (leaflet.js:5)...)</p>
  
  <p>I tried many things :
  Before i use map.remove()
  I was getting  this error (Map container is already initialized.) with no action at all .
  I also tried map.off() before map.remove() trying to remove the map from the container before reusing it again . 
  I tried google search with no luck at all . any help would be appreciated .</p>
  
  <pre><code>new Vue({
      el: '#app',
      data: {
          /* Data properties will go here */
          map: null,
          tileLayer: null,
          loading: true,
          errored: false,
          xxx: [],
          selectedValue: null,
          marker: null,
          geocoder: null,
      },
  
      computed: {
  
          onlyUnique() {
  
              return [...new Set(this.xxx.map((city =&gt; city.location.name)))];
          }
  
      },
  
      mounted() {
          /* Code to run when app is mounted */ // when the Vue app is booted up, this is run automatically.
          this.initMap();
  
          axios
              .get('URL ')
              .then(response =&gt; (this.xxx= response.data)).catch(function(error) {
                  // handle error
                  console.log("////error///");
                  console.log(error);
                  this.errored = true;
              }).finally(() =&gt; this.loading = false);
  
  
            this.xxx.forEach(function(item) {
              console.log("entered");
              L.marker(this.item.location.gps.coordinates).addTo(this.map).bindPopup(this.item.car_model).openPopup();;
              console.log("entered down");
              console.log(car);
          });
  
      },
  
      methods: {
          /* Any app-specific functions go here */
          initMap() {
  
              this.map = L.map('map', {
                  center: [20.0, 5.0],
                  minZoom: 2,
                  zoom: 2
              });
              this.tileLayer = L.tileLayer(
                  'https://cartodb-basemaps-{s}.global.ssl.fastly.net/rastertiles/voyager/{z}/{x}/{y}.png', {
                      maxZoom: 18,
                      attribution: '&amp;copy; &lt;a href="http://www.openstreetmap.org/copyright"&gt;OpenStreetMap&lt;/a&gt;, &amp;copy; &lt;a href="https://carto.com/attribution"&gt;CARTO&lt;/a&gt;',
                      subdomains: ['a', 'b', 'c']
                  }
              );
              this.tileLayer.addTo(this.map);
          },
  
          onChange(event) {
  
  
              // this.map.remove();
  
  
              this.selectedValue = event.target.options[event.target.options.selectedIndex].text;
              this.geocoder = L.esri.Geocoding.geocodeService();
  
              this.geocoder.geocode().text(this.selectedValue).run(function(error, response) {
  
                  if (error) {
  
                      return;
                  }
  
                  this.map = L.map(map);
                  this.tileLayer = L.tileLayer(
                      'https://cartodb-basemaps-{s}.global.ssl.fastly.net/rastertiles/voyager/{z}/{x}/{y}.png', {
                          maxZoom: 18,
                          attribution: '&amp;copy; &lt;a href="http://www.openstreetmap.org/copyright"&gt;OpenStreetMap&lt;/a&gt;, &amp;copy; &lt;a href="https://carto.com/attribution"&gt;CARTO&lt;/a&gt;',
                          subdomains: ['a', 'b', 'c']
                      }
                  );
                  this.tileLayer.addTo(this.map);
  
                  this.map.fitBounds(response.results[0].bounds);
  
              });
  
              console.log(this.selectedValue);
          }
      },
  
  });```
  </code></pre>