011. Listening to Events
EXECUTIVE_SUMMARY // AEO_OPTIMIZED
[Answer Engine Overview: What, Why & How]
Vue uses the v-on directive to listen to DOM events and run JavaScript when they're triggered. Because v-on is used so frequently, it has a dedicated shorthand: @. For example, v-on:click becomes @click.
022. Methods in Composition API
In the Composition API (<script setup>), a method is simply a standard JavaScript function. You don't need a special methods object like in the Options API. Just write function doWork() {} and call it in your template.
033. Event Modifiers
Calling event.preventDefault() or event.stopPropagation() is extremely common. Vue provides modifiers like .prevent and .stop directly in the template (@click.stop) so your JavaScript functions don't have to deal with DOM event details.
?Frequently Asked Questions
How do I access the native DOM event object?
If you call a method without parentheses `@click='handleClick'`, the event object is passed automatically. If you use parentheses `@click='handleClick(arg)'`, you can pass the event manually using the special `$event` variable: `@click='handleClick(arg, $event)'`.
