監聽事件：

可以用 v-on 指令監聽 DOM 事件來觸發一些 JavaScript 代碼

示例

方法事件處理器：

許多事件處理的邏輯都很復雜，所以直接把 JavaScript 代碼寫在 v-on 指令中是不可行的。因此 v-on 可以接收一個定義的方法來調用

示例

內聯處理器方法：

除了直接綁定到一個方法，也可以用內聯 JavaScript 語句

有時也需要在內聯語句處理器中訪問原生 DOM 事件。可以用特殊變量 $event 把它傳入方法

事件修飾符：

在事件處理程序中調用 event.preventDefault() 或 event.stopPropagation() 是非常常見的需求。盡管我們可以在 methods 中輕松實現這點，但更好的方式是：methods 只有純粹的數據邏輯，而不是去處理 DOM 事件細節

為了解決這個問題， Vue.js 為 v-on 提供了 事件修飾符。通過由點(.)表示的指令后綴來調用修飾符

.stop、.prevent、.capture、.self

按鍵修飾符：

在監聽鍵盤事件時，我們經常需要監測常見的鍵值。 Vue 允許為 v-on 在監聽鍵盤事件時添加按鍵修飾符

記住所有的 keyCode 比較困難，所以 Vue 為最常用的按鍵提供了別名

全部的按鍵別名：
enter、tab、delete (捕獲 “刪除” 和 “退格” 鍵)、esc、space、up、down、left、right

總結

以上是生活随笔為你收集整理的Vue基础之事件处理器的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。