Vue 按鍵修飾符

2021-10-10 15:26:59 字數 538 閱讀 3380

在監聽鍵盤事件時,我們經常需要檢查詳細的按鍵。vue 允許為v-on在監聽鍵盤事件時新增按鍵修飾符:

你可以直接將keyboardevent.key暴露的任意有效按鍵名轉換為 kebab-case 來作為修飾符。

在上述示例中,處理函式只會在$event.key等於pagedown時被呼叫。

使用keycodeattribute 也是允許的:

為了在必要的情況下支援舊瀏覽器,vue 提供了絕大多數常用的按鍵碼的別名:

你還可以通過全域性config.keycodes物件自定義按鍵修飾符別名:

// 可以使用 `v-on:keyup.f1`

vue.config.keycodes.f1 = 112

Vue筆記 2 事件修飾符 按鍵修飾符

修飾符 作用用來和事件連用,用來決定事件觸發條件或者是阻止事件的觸發機制 1.事件修飾符 stop修飾符 用來阻止事件冒泡 事件冒泡 詳情 prevent 事件修飾符 用來阻止標籤的預設行為 self 事件修飾符 用來針對於當前標籤的事件觸發 只觸發自己標籤的上特定動作的事件 只關心自己標籤上觸發的...

14 按鍵修飾符

在監聽鍵盤事件時,我們經常需要使用特定的按鍵。vue允許為v on在監聽鍵盤事件時新增按鍵修飾符 v on keyup.enter submit 使用.enter鍵值修飾符,示例如下 鍵值修飾符title src script type text keyup.enter print p div va...

Vue自定義按鍵修飾符

在製作網頁的時候,常常會使用到各種鍵盤事件 例如keyup,當發生鍵盤抬起的事件時,會被觸發,那怎麼讓其只在特定的按鍵抬起時才觸發呢?上個例子 head keydown mi p div let vue1 newvue methods script 上面的例子中,給input繫結了鍵盤事件,當按下鍵...