一、什么是事件修饰符
Vue
在 Vue.js 中，事件修饰符是一种用于处理 DOM 事件的特殊指令，可以在事件处理程序中提供额外的控制或功能。Vue 中的事件修饰符是以 . 开头的指令后缀，常用的事件修饰符包括以下一些：
- .stop：阻止事件冒泡。
- .prevent：阻止事件的默认行为。
- .capture：使用事件捕获模式。
- .self：只当事件在该元素本身（比如不是子元素）触发时触发回调。
- .once：事件只触发一次。
- .passive：事件的默认行为立即执行，无需等待事件回调结束。
下面依次说明这些事件修饰符的使用方法：
.stop：阻止事件继续传播，即调用 event.stopPropagation()。
<button @click.stop="handleClick">Click Me</button>
.prevent：阻止事件的默认行为，即调用 event.preventDefault()。
<form @submit.prevent="handleSubmit">Submit Form</form>
.capture：使用事件捕获模式。
<div @click.capture="handleCapture">Div</div>
.self：只当事件在该元素本身触发时触发回调。
<div @click.self="handleSelf">Div</div>
.once：事件只触发一次。
<button @click.once="handleOnce">Click Me</button>
.passive：事件的默认行为立即执行，无需等待事件回调结束。
< @=>Scroll Area
