Vue.js allows us to intercept any DOM event by using the v-on directive on an element.
If we want to do something when a click event happens in this element:
Syntax
<button @click="clickHandler"></button>
Types of Vue.js events that you can handle
- submit
- keyup
- drag
- scroll
- error
- abort
- mouseover
- mouseout
- load etc.
Example
OutPut:
Before click
![](https://www.devopsconsulting.in/blog/wp-content/uploads/2022/11/image-1.png)
After click