CODEWITHSUNDEEP
javascriptvue.jsleaflet
thelastray
thelastray

Reputation: 482

Refer to Vue instance from another element instance

I have created a leaflet map with vue.js. I have a method named 'showSubmit, which is to be called at leaflet marker moveend event. This is what I am doing:

this.map.markers.user.on("moveend", function(e) {
    this.showSubmit(e);
});

However, this call is showing error, as 'this' within the function refers to the leaflet map instance and not the vue instance. As a workaround, I have declared a variable, like this:

var $this = this;
this.map.markers.user.on("moveend", function(e) {
        $this.showSubmit(e, $this);
});

Although this works, but I want to avoid this approach. How can I access the vue component from within leaflet map instance?

Upvotes: 0

Views: 137

Answers (2)

Aldarund
Aldarund

Reputation: 17621

If you can use ES6 features, than arrow functions will help, they dont change this.

this.map.markers.user.on("moveend", (e) => {
    this.showSubmit(e);
});

Upvotes: 1

santanu bera
santanu bera

Reputation: 1311

Bind this instance like the following -

this.map.markers.user.on("moveend", function(e) {
  this.showSubmit(e);
}.bind(this));

Upvotes: 2

Related Questions