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
After click
I’m Abhishek, a DevOps, SRE, DevSecOps, and Cloud expert with a passion for sharing knowledge and real-world experiences. I’ve had the opportunity to work with Cotocus and continue to contribute to multiple platforms where I share insights across different domains:
-
DevOps School – Tech blogs and tutorials
-
Holiday Landmark – Travel stories and guides
-
Stocks Mantra – Stock market strategies and tips
-
My Medic Plus – Health and fitness guidance
-
TrueReviewNow – Honest product reviews
-
Wizbrand – SEO and digital tools for businesses
I’m also exploring the fascinating world of Quantum Computing.