Vue TutorialLesson 9Free preview

Vue v-on

This lesson is part of Vue · All levels

Summary

The v-on directive is used to listen to DOM events and run code or method when they happen. The v-on syntax is followed by the event name, and Vue provides a much more concise abbreviation @ so it is more commonly used. Extra event parameters, such as event objects, can be passed to the method through parentheses.

Key points

V-on:name Genesis listens to a specific DOM event.
The v-on abbreviation is @, for example @click.
The handler can be an inline expression or a method call.
The event object can be passed to the method, for example @click="proses($event)".
Event modifiers such as .stop, .prevent, and .once are available.

Full lesson

Code examples and quizzes

Full lessons, code examples, and quizzes are available to subscribers. 5 questions.