You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
I am trying to implement the package in a Vue3 project with Nuxt2 and after a little troubleshooting around the issues section i followed the advice some of the users gave and injected it the following way:
import VueGoogleAutocomplete from 'vue-google-autocomplete';
Vue.use(VueGoogleAutocomplete);
Vue.component('vue-google-autocomplete', VueGoogleAutocomplete)
in the components as described in the example
<h3 class="title is-4">Start typing an address and below you will see found result,
<a v-on:click="$refs.address.geolocate()">or force current location</a>
</h3>
<vue-google-autocomplete
id="map"
ref="address"
classname="input"
placeholder="Start typing"
v-on:placechanged="getAddressData"
v-on:error="handleAddressError"
country="sg"
>
</vue-google-autocomplete>
Of course I double checked if the key is correct, which would be highly unlikely to be incorrect because it was copy-pasted.
I have generated 2 keys and they look different:
The first key that has no attached billing details to it looks like 'AIzaSyD5D...' *note doesnt have a dash
The 2nd key with set billing info is starts like this 'AIzaSyC-NBGh....'
Any ideas how could this be fixed?
The text was updated successfully, but these errors were encountered:
Fellow developers, whoever faces this issue in the future just try deleting and re-creating the api key as it seems INDEED that dash was badly generated key from google's side and something simple as re-generating the key fixes the issue.
Peace.
Hello!
I get the following error on input of address:
Google Maps JavaScript API error: InvalidKeyMapError
https://developers.google.com/maps/documentation/javascript/error-messages#invalid-key-map-error
I am trying to implement the package in a Vue3 project with Nuxt2 and after a little troubleshooting around the issues section i followed the advice some of the users gave and injected it the following way:
nuxt.config.js
plugins folder in project root - map-places.js
in the components as described in the example
Of course I double checked if the key is correct, which would be highly unlikely to be incorrect because it was copy-pasted.
I have generated 2 keys and they look different:
The first key that has no attached billing details to it looks like 'AIzaSyD5D...' *note doesnt have a dash
The 2nd key with set billing info is starts like this 'AIzaSyC-NBGh....'
Any ideas how could this be fixed?
The text was updated successfully, but these errors were encountered: