Modifiers for Custom Events

Custom events are a staple of flexible Vue components. They help us write more meaningful code and abstract logic away. Event modifiers are helpful to alter the behavior of events and steer how they work. Let’s combine the two.

Motivation and use cases

Multi-device support has become a standard in today’s web development. People use web apps with smartphones on public transport, laptops and desktop devices at work, and tablets at home. As a result, power-user applications with many shortcuts that make heavy use of keyboard-based event modifiers might not always work the way we want them to.

Imagine a Vue app ...