Access method from event handler Vue.JS

Question

I don't know how to explain it but i just want to ask why i cannot execute the getTransaction method from the $on event handler. The console will just display error like that.

var transactioninfo = {
  template: `<p>hello</p>`,
  methods: {
    getTransaction: function() {
      alert('test')
    }
  },
  mounted: function() {
    event_broadcaster.$on('showSelected', function(payload) {
      this.transactioninfo.getTransaction();
    })
  },
  data () {
    return {
      Transaction: [],
    }
  },
}

user320487 · Accepted Answer · 2018-03-10 06:36:00Z

1

You are changing the context of this when you pass in a callback using function syntax. Change it to es6 arrow notation and it should work:

event_broadcaster.$on('showSelected', (payload) => {
    this.getTransaction();
})

answered Mar 10, 2018 at 6:36

user320487

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

Collectives™ on Stack Overflow

Access method from event handler Vue.JS

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