Keyboard-Based Event Modifiers

Learn how to use Vue's keyboard-based event modifiers.

Event modifiers are an excellent way to fine-tune our apps. They make the code cleaner and let us focus on what’s essential to our event listeners—the actual logic. For example, let’s say our methods only contain relevant code instead of additional code to distinguish a control click from a standard click. Event modifiers are helpful because complex power-user applications can benefit a lot from using the keyboard. Keyboard modifiers can be attached to any event, making the experience richer. We can even combine them to add different functionalities.

Event modifiers

We can add modifiers to almost any event in Vue. We add modifiers in the DOMDOM to the event listener. For example, to prevent the default from happening on a form submit, we can add the prevent modifier.

Get hands-on with 1200+ tech skills courses.