事件处理

我们可以使用 v-on 指令 (简写为 @) 来监听 DOM 事件，并在事件触发时执行对应的 JavaScript 代码。用法：v-on:click="methodName" 或 @click="methodName"

事件处理器

事件处理器的值可以是

1. 内联事件处理器：事件被触发时执行的内联 JavaScript 语句 (与 onclick 类似)
2. 方法事件处理器：一个指向组件上定义的方法的属性名或是路径

内联事件处理器（不推荐）

方法事件处理器（推荐）

事件传参

获取event参数

获取普通参数

同时获取普通参数和event

注意

传递多个参数时，event事件对象要放到最后，加$符号

事件修饰符

在处理事件时调用 event.preventDefault() 或 event.stopPropagation() 是很常见的。尽管我们可以直接在方法内调用，但如果方法能更专注于数据逻辑而不用去处理 DOM 事件的细节会更好

为解决这一问题，Vue 为 v-on 提供了事件修饰符，常用有以下几个：

1. .stop
2. .prevent
3. .once
4. .enter
5. ......

更多请参考：https://cn.vuejs.org/guide/essentials/event-handling.html#event-modifiers