Normally, JavaScript provides event.preventDefault() or event.stopPropagation() inside event handlers. We can use Vue.js methods, but these methods are meant for data logic instead of dealing with DOM events.

Vue.js provides the following event modifiers for v-on and these modifiers are directive postfixes denoted by a dot symbol.

• .stop
• .prevent
• .capture
• .self
• .once
• .passive

See the following example of stop modifier:

1. <!– the click event’s propagation will be stopped –>  
2. <a v-on:click.stop=”methodCall”></a>  

Example of chain modifiers as follows:

1. <!– modifiers can be chained –>  
2. <a v-on:click.stop.prevent=”doThat”></a>