一、事件處理

使用v-on或者@后面加事件：

<template><button v-on:click="addCount()">{{count}}</button>
</template>

二、事件傳參

傳event：

• 不傳參時，默認自動接收?event

• 傳自定義參數時，需顯式傳遞?$event

三、事件修飾符

1. 基礎修飾符

修飾符	作用	示例
.stop	阻止事件冒泡	@click.stop="handler"
.prevent	阻止默認行為	@submit.prevent="handler"
.capture	使用捕獲模式（事件從外向內觸發）	@click.capture="handler"
.self	僅當事件在元素自身觸發時執行	@click.self="handler"
.once	事件只觸發一次	@click.once="handler"
.passive	提升滾動性能（與?.prevent?沖突）	@scroll.passive="handler"

2. 按鍵修飾符

修飾符	作用	示例
.enter	回車鍵觸發	@keyup.enter="handler"
.tab	Tab 鍵觸發	@keydown.tab="handler"
.esc	ESC 鍵觸發	@keyup.esc="handler"
.space	空格鍵觸發	@keyup.space="handler"
.up	上箭頭鍵觸發	@keyup.up="handler"
.down	下箭頭鍵觸發	@keyup.down="handler"
.left	左箭頭鍵觸發	@keyup.left="handler"
.right	右箭頭鍵觸發	@keyup.right="handler"
.ctrl	Ctrl 鍵組合觸發	@click.ctrl="handler"
.exact	精確匹配按鍵組合（無其他鍵按下）	@click.ctrl.exact="handler"

3. 鼠標修飾符

修飾符	作用	示例
.left	鼠標左鍵觸發	@mousedown.left="handler"
.right	鼠標右鍵觸發	@mousedown.right="handler"
.middle	鼠標中鍵觸發	@mousedown.middle="handler"

Vue 支持所有原生 DOM 事件，以下是一些常見事件：

事件類型	觸發場景	示例
click	點擊元素	@click="handler"
dblclick	雙擊元素	@dblclick="handler"
input	輸入框內容變化（實時觸發）	@input="handler"
change	表單元素值變化（失焦后觸發）	@change="handler"
submit	表單提交	@submit="handler"
keydown	鍵盤按下	@keydown="handler"
keyup	鍵盤釋放	@keyup="handler"
mousedown	鼠標按下	@mousedown="handler"
mouseup	鼠標釋放	@mouseup="handler"
mousemove	鼠標移動	@mousemove="handler"
mouseenter	鼠標進入元素	@mouseenter="handler"
mouseleave	鼠標離開元素	@mouseleave="handler"
scroll	元素滾動	@scroll="handler"
focus	元素獲得焦點	@focus="handler"
blur	元素失去焦點	@blur="handler"

?

?