fega / vue2-leaflet-geosearch

GeoSearch plugin extension for vue2-leaflet package
MIT License
34 stars 15 forks source link

How do you access the results #19

Open marcuus opened 4 years ago

marcuus commented 4 years ago

The demo code seems to work fine putting the select result address into the input field. But how does the parent component access this field?

Guysnacho commented 4 years ago

This was halfway answered in issue #3 but the way I handled it was like this

mounted() {
    this.$refs.map.mapObject.on("geosearch/showlocation", response => {
      this.address = response.location.label;
    });
}

In the official documentation it shows the format of results, if you handle it with "showlocation" then you get a payload with a both a location object and a marker object. The location object has everything you need and it follows the given format in the documentation. Hopefully that helps, I thought it was broken for a while but I wasn't paying attention to the leaflet events.

Edit Make sure you add a ref to the lmap component so you can access it this way

darrenklein commented 4 years ago

I found that it's referenced in the readme.md in the Node module, though it doesn't seem to come up on the Github landing page for this repo - but as noted above, you'll need to use a ref. Quoth the readme:

Events

geosearch/showlocation is fired when location is chosen from the result list.

map.on('geosearch/showlocation', yourEventHandler);

geosearch/marker/dragend is fired when marker has been dragged.

map.on('geosearch/marker/dragend', yourEventHandler);