Vuetify: Custom function when clicking outside a v-dialog

[rnenjoy]

New Functionality

I would like that clicking outside of a v-dialog to call my custom function.

Improvements

Now i have to make it persistent to disable it all together.

Bugs or Edge Cases it Helps Avoid

Sometimes you need a special function to be called when closing a modal. In my use case now, i change the URL back to what it was before. Twitter style modals that works with history back button.

[johnleider]

You can do this by simply watching the model you pass to v-dialog.

https://codepen.io/johnjleider/pen/oErQdg

[rnenjoy]

That is genuis! Thanks so much @johnleider !

[AlexandroWillianHervis]

just use @input and :value

[manavm1990]

@AlexandroWillianHervis Yes, that's what I did. Doing it with just direct linking with just :dialog required an extra click to update the value of :dialog.
Now, @input just calls a method that uses $emit.

I don't quite get all of the inner workings and/or Vue warnings, but I been adhering to them as much as possible.

[mdisconzi]

Ok, is possible to catch the close event watching the model, but, how I can abort the closing event?

[manavm1990]

So, if you just want to prevent closing, then sounds like you just need a PERSISTENT ‘dialog’?

---

persistent
Default
false
Type
boolean
Clicking outside will not dismiss the dialog

---

https://vuetifyjs.com/en/components/dialogs#introduction

[mdisconzi]

So, if you just want to prevent closing, then sounds like you just need a PERSISTENT ‘dialog’?

persistent
Default
false
Type
boolean
Clicking outside will not dismiss the dialog

https://vuetifyjs.com/en/components/dialogs#introduction

Not really, I want to can display a confirm dialog when close event is emitted (button or clicked oustide modal), but, cancel close event when user not confirm

[johnleider]

We kindly ask users to not comment on closed/resolved issues. If you believe that this issue has not been correctly resolved, please create a new issue showing the regression or reach out to us in our Discord community.

Thank you for your contribution and interest in improving Vuetify.