【Vuetifly：Dialog】オーバーレイを押してモーダルを非表示

オーバーレイを押してモーダルを非表示にする

VuetiflyでOverlayを押した時にモーダルを削除する方法

発生したエラー

dialogをtrueにしてモーダルを表示してオーバーレイを押すとエラーが発生する

解決策

リファレンスに書いてある
https://vuetifyjs.com/ja/api/v-dialog/#events-click:outside

**click:outside　：　**アクティブなダイアログの外側をクリックしたときに発生するイベント

使い方

子
<v-dialog v-model="this.dialog" @click:outside="dailogStateChange">
     ~~~~~~~~~~~~~~
</v-dialog>
methods: {
  dailogStateChange() {
    this.$emit('dailogStateChange');
  },
}

親
methods: {
  dailogStateChange() {
    this.dialog = !this.dialog;
  },
}

または

<v-dialog v-model="this.dialog" @click:outside="!this.dialog">
     ~~~~~~~~~~~~~~
</v-dialog>

後者の方が楽ちんだけど
子では親のデータを更新できないので臨機応変に対応する