Close dialog when ESC key is pressed

September 17, 2023 by Tarik

Add @keydown.esc="dialog = false" to v-dialog component

<v-dialog v-model="dialog" @keydown.esc="dialog = false"></v-dialog>

data: () => ({
  dialog: false
}),

Working example:
https://codepen.io/anon/pen/BJOOOQ

Additionally, if using dialog as custom component then possibly we need to emit input event:

<template>
  <v-dialog :value="value" @keydown.esc="$emit('input')">
  ...