How to handle click when using Vue2Leaflet?

Question

I am using Vue2Leaflet(https://github.com/KoRiGaN/Vue2Leaflet) with vuejs2, I already render the map, and I want to add a function to handle when click the map, as I read the document https://korigan.github.io/Vue2Leaflet/#/ but still don't how to do.

Any advice would be appreciated.

Vadim Gremyachev · Accepted Answer · 2018-12-27 22:32:02Z

3

The following example demonstrates how handle map click event in Vue2Leaflet:

<l-map :zoom="zoom" :center="center" @click="handleMapClick">
   <l-tile-layer :url="url" :attribution="attribution"></l-tile-layer>
</l-map>



export default {
  name: "LeafletMap",
  components: {
    "l-map": LMap,
    "l-tile-layer": LTileLayer,
    "l-marker": LMarker
  },
  data() {
    return {
      zoom: 13,
      center: L.latLng(47.41322, -1.219482),
      url: "http://{s}.tile.osm.org/{z}/{x}/{y}.png",
      attribution:
        '&copy; <a href="http://osm.org/copyright">OpenStreetMap</a> contributors',
    };
  },

  methods: {
    handleMapClick(event) {
       //...
    }
  }
};

Here is a demo

edited Dec 27, 2018 at 22:32

answered Dec 27, 2018 at 22:25

Vadim Gremyachev

59.6k21 gold badges139 silver badges205 bronze badges

Sign up to request clarification or add additional context in comments.

Collectives™ on Stack Overflow

How to handle click when using Vue2Leaflet?

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Related