0 day streak
javascript / beginner
Snippet

Event Handling

Vue allows you to listen to DOM events using the v-on directive (shorthand @). You can trigger JavaScript functions directly when an event occurs, like a mouse click.

snippet.js
javascript
1
2
3
4
5
6
7
8
9
<script setup>
function sayHello(name) {
alert('Hello ' + name);
}
</script>
<template>
<button @click="sayHello('Vue')">Click Me</button>
</template>
vue
Breakdown
1
function sayHello(name) { ... }
A standard JavaScript function defined within the script setup block.
2
@click="sayHello('Vue')"
Attaches a click event listener to the button that calls the function with an argument.