Key modifiers

We're not limited to simply using the enter modifier, we also have access to a variety of shorthand modifiers, for example the use of the @ symbol and shortening v-on:event.name v-on: by replacing it with the @ symbol. Other shortening methods include:

Other modifiers can be seen in the following table:

Name Description Code Example
.enter Whenever the Enter key is tapped. <input v-on:keyup.enter="myFunction" />
.tab Whenever the Tab key is tapped. <input v-on:keyup.tab="myFunction" />
.delete Whenever the Delete or Backspace key is tapped. <input v-on:keyup.delete="myFunction" />
.esc Whenever the Esc key is tapped. <input v-on:keyup.esc="myFunction" />
.up Whenever the up arrow key is tapped. <input v-on:keyup.up="myFunction" />
.down Whenever the down arrow key is tapped. <input v-on:keyup.down="myFunction" />
.left Whenever the left arrow key is tapped. <input v-on:keyup.left="myFunction" />
.right

Whenever the right arrow key is tapped.

<input v-on:keyup.right="myFunction" />