vue -- 按鍵修飾符

在監聽鍵盤事件時，我們經常需要查找常用按鍵對應的 code 值。Vue 可以在 v-on 上添加按鍵修飾符，用於監聽按鍵事件
這里列出所有的按鍵修飾符別名：

.enter => // enter鍵
.tab => // tab鍵
.delete (捕獲“刪除”和“退格”按鍵) => // 刪除鍵
.esc => // 取消鍵
.space => // 空格鍵
.up => // 上
.down => // 下
.left => // 左
.right => // 右

記住所有 keyCode 是非常麻煩的事，所以 Vue 提供一些最常用按鍵的別名

<!-- 也可用於簡寫語法 -->
<input @keyup.enter="submit">

自定義按鍵修飾符別名

// 可以使用 `v-on:keyup.f1`
Vue.config.keyCodes.f1 = 112

自動對應按鍵修飾符
也可以直接使用 KeyboardEvent.key 暴露出來的所有合法按鍵名作為修飾符，但是要將它們轉換為串聯式命名(kebab-case)

<input @keyup.page-down="onPageDown">

系統輔助按鍵
僅在以下修飾符對應的按鍵被按下時，才會觸發鼠標或鍵盤事件監聽器

.ctrl
.alt
.shift
.meta

例如：

<!-- Alt + C -->
<input @keyup.alt.67="clear">

<!-- Ctrl + Click -->
<div @click.ctrl="doSomething">做一些操作</div>