Vue如何監聽鍵盤事件中的按鍵

在我們的專案經常需要監聽一些鍵盤事件來觸發程式的執行，而vue中允許在監聽的時候新增關鍵修飾符：

"submit"

>

"submit"

>
<
!-- 縮寫形式 --
>

.enter

.tab

.delete (捕獲「刪除」和「退格」鍵)

.esc

.space

.up.down

.left

.right

修飾鍵：

.ctrl

.alt

.shift

.meta

與按鍵別名不同的是，修飾鍵和 keyup 事件一起用時，事件引發時必須按下正常的按鍵。換一種說法：如果要引發 keyup.ctrl，必須按下 ctrl 時釋放其他的按鍵；單單釋放 ctrl 不會引發事件

<

!-- 按下alt + 釋放c觸發 --
>
"clear"
>
<
!-- 按下alt + 釋放任意鍵觸發 --
>
"other"
>
<
!-- 按下ctrl + enter時觸發 --
>
"submit"
>

"form.name" placeholder=

"暱稱" @keyup.enter=
"submit"
>
"form.name" placeholder=
"暱稱" @keyup.enter.native=
"submit"
>
<
/el-input>

vue監聽鍵盤事件中的按鍵

在vue中，已經為常用的按鍵設定了別名，這樣我們就無需再去匹配keycode，直接使用別名就能監聽按鍵的事件。別名 實際鍵值 delete delete 刪除 backspace 退格 tab tab.enter enter 回車 esc esc 退出 space space 空格鍵 left le...

Vue中監聽鍵盤事件

一，在vue中，已經為常用的按鍵設定了別名，這樣我們就無需再去匹配keycode，直接使用別名就能監聽按鍵的事件 keyup.enter function 屬性名 鍵值.delete delete 刪除 backspace 退格 tab tab.enter enter 回車 esc esc 退出 s...

vue監聽組建鍵盤事件

表單提交時需要處理輸入框的回車事件，一般的原生input標籤可以用 keyup.enter onsubmit tips onsubmit為定義的方法 但是在組建裡就不好用，需要多加乙個native，如下 keyup.enter onsubmit 改寫為 keyup.enter.native onsu...