MadimetjaShika / vuetify-google-autocomplete

A Vuetify ready Vue.js autosuggest component for the Google Places API.
https://madimetjashika.github.io/vuetify-google-autocomplete/
MIT License
97 stars 53 forks source link

Cannot read property 'setBounds' of null when using vueGoogleMapsCompatibility #112

Open toddb opened 4 years ago

toddb commented 4 years ago

Error affects v2.0.4 with vueGoogleMapsCompatibility:

Cannot read property 'setBounds' of null

Steps to reproduce:

import Vue from 'vue';
import * as VueGoogleMaps from 'vue2-google-maps';
import VuetifyGoogleAutocomplete from 'vuetify-google-autocomplete';

// @see https://www.npmjs.com/package/vue2-google-maps
Vue.use(VueGoogleMaps, {
    load: {
        key: 'xxxxxxxxs',
        // This is required to use the Autocomplete plugin
        libraries: 'places', // 'places,drawing,visualization'
    },
});

Vue.use(VuetifyGoogleAutocomplete, {
    /*
      not used as loaded with component
      apiKey: key,
    */
    vueGoogleMapsCompatibility: true,
});

The issue is that the lazy load promise of gmaps is not yet complete, so this.autocomplete is not yet intialised. Thus the error occurs:

           this.setupGmapApi(() => {
              const circle = new window.google.maps.Circle({
                center: geolocation,
                radius: position.coords.accuracy,
              });
              this.autocomplete.setBounds(circle.getBounds());  // autocomplete not yet initialised from setupGoogle()
              this.geolocateSet = true;
            });
          });