Interacting with the Marker component

First of all, thanks for the great plugin! Please excuse me if this is a Vue.js question rather than specific to this plugin. I’m new to Vue.js and might just be missing something…

I have a map with many markers on it, and would like to react to the user clicking or hovering over one of the markers. I used v-on:l-mouserover and v-on:l-click to get an event out of it. The problem is that I can’t then access the marker component with its props, only the Leaflet object as target. I would like to be able to access the props as they tell me the identity of the marker in question. I tried using a mixin with the v-marker component to be able to use this, but I didn’t manage to do that.

I also tried to create a custom component for the marker, that includes the <v-marker> component within its template, but no marker was rendered. Should this be possible? (i.e. a custom component for the marker that adds the features I need and include it within a <v-map> component?)

Is there a better way?

Thanks for any help you can give!

[mgiraldo]

i ended up adding a ref to each marker and using a shared identifier to open it programmatically like so:

this.$refs[identifier][0].mapObject.openPopup()

note the [0] because markers are in a v-for and the $refs returns an array there

[KoRiGaN]

Hi @omrihar,

Here is an example of how I would do it.

No modification of Vue2Leaflet required. Just send you contact as a parameter of the event handler.

Hope this helps!

Mickaël