This tutorial explains how you can easily implement a Places Autocomplete Service by Google Maps API in vue.js
NOTE: the picture is fancy because...
Some comments have been hidden by the post's author - find out more
For further actions, you may consider blocking this person and/or reporting abuse
Since GMAP script tag is added via vue meta and is also responsible for calling MapInit (which is setting the service data), if the component re-mounts or the user briefly navigates away, service will become NULL and the api will stop working.
It's working fine in my case. You can login to the website gradbee.com and check.
I believe this is true. This is why also it seems, adding more than one of these components to a page won't work, and the service never gets set, and stays null.
Yes, I'm facing the same issue as well. Did you solve it?
I did. I just had to change when initmap was called. I think I set a check for it in the watcher for location. When I get back home, I'll double check.
So this maybe not the best solution, and there maybe a better a way, but it was done quickly, as I'm still working on this. Here is a gist of the component I have right now. There is a bunch of irrelevant stuff in it for this, but at least it gives you an idea of what I did.
gist.github.com/pixelsoul/8b854e39...
I like to use APIs, you can find more here: any-api.com
Hi Siddharth,
is it possible to share Github Link ?
Will create a gist / repo soon!
You saved my ars Thank you a lot ;-)
Hi, I'm wondering how with this example can I restrict results by country, and how can get addresses results instead of cities. Thanks in advance!
Hi, you can do this :
developers.google.com/maps/documen...
developers.google.com/maps/documen...
This is live on gradbee.com
When you register your account you'll need to enter the location, you can find it there.
Can you add another tutorial for vue 3 ?
This plugin works for vue3 ? I can not search doc how to initialize vue-meta on vue3.