Vue can capture events like click events and key press events. An event occurs whenever the user does something with the app: mouse clicks, key presses etc.
To connect an event to a HTML element, add v-on in the HTML tag.
Vue supports these events:
To capture a click event, add v-on:click to an HTML element. Between the quotes, write the name of your method.
In your app.js define the method:
Vue can get keypress events with v-on:keydown.
If you press a key in an input field, you can call a method using the event parameter:
You can get the key code and key value with:
This works for all HTML elements, you could have a span if you want to catch key presses for the whole page: