It is a very common need to call event.preventDefault() or event.stopPropagation() inside event handlers. Although we can do this easily inside methods, it would be better if the methods can be purely about data logic rather than having to deal with DOM event details.

To address this problem, Vue provides event modifiers for v-on. Recall that modifiers are directive postfixes denoted by a dot.

ref. Event Handling — Vue.js

<!-- the submit event will no longer reload the page -->
<form v-on:submit.prevent="onSubmit"></form>