Pass the Event Object and Other Arguments to v-on in Vue.js

We can pass arguments to event handlers when we call the in v-on.

To pass the event object, we pass $event into the event handler.

We can also pass in any other arguments we want.

For instance, we can write the following HTML:

<input type="number" v-on:input="addToCart($event, ticket.id)">

And we can write:

methods: {
  addToCart(event, id) {
    // ...
  }
}

Then the event parameter has the $event object as its value.

id‘s value is ticket.id.

The input event is runs the addToCart method with those value if it’s triggered.

Vue is very flexible with event handler methods.