vue中用v-on（缩写@）监听dom事件，支持传参、访问原生事件对象、修饰符及内联多语句执行，推荐封装复杂逻辑到methods中。
Vue 中用 v-on 监听 DOM 事件，核心是把用户操作（比如点击、输入）和 JavaScript 方法关联起来。最常用也最推荐的方式是用缩写 @，写法简洁，语义清晰。
基础绑定：@click 触发一个方法
在模板中给元素加上 @click="methodName"，再在 methods 选项里定义对应函数即可：
<button>点我</button>- 在
methods中写：handleClick() {<br> console.log('按钮被点了');<br> this.count++; // 可直接访问 data 中的数据<br>}
传参：带参数调用或获取原生事件对象
需要向方法传值，或者同时拿到 DOM 事件对象时，有两种常见方式：
- 只传自定义参数：
@click="say('你好')"，方法接收say(msg) { console.log(msg); } - 既要传参又要事件对象：
@click="handle('确认', $event)"，方法写成handle(msg, event) { event.preventDefault(); console.log(msg); }
常用事件名与内联写法
Vue 支持所有标准 DOM 事件，无需额外注册。常见有：@click、@input、@submit、@keyup.enter 等。
简单逻辑可直接写在模板里，比如：@click="count++" 或 @submit.prevent="onSubmit"（.prevent 是修饰符，自动阻止表单默认提交）。
多个方法一起执行
同一个事件想触发多个操作，可以在内联表达式中用分号连接：
@click="logAction(); updateStatus(); sendRequest()"- 注意：这种写法适合轻量逻辑；复杂流程建议封装进一个方法里，保持可读性和可维护性
前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！
