Quasar: QDialog - v-close-popup programmatically?

Created on 11 Sep 2020  路  3Comments  路  Source: quasarframework/quasar

Is your feature request related to a problem? Please describe.
Sorry if this has already has been asked before, but is it possible to dismiss an active dialog or all dialogs as the same features v-close-popup offers?

Describe the solution you'd like

<q-btn @click="openModal" />

openModal () {
      this.$q.dialog.close() // <-- close current modal
      this.$q.dialog.close('id') // <-- close modal by id

      this.$q.dialog({
        component: dialogComponent,
        parent: this
      })
}

Describe alternatives you've considered
Using a global bus? Emits doesn't seem to work.

Additional context
It is possible using a dialog component, but you need to inject every component.

feature request

Most helpful comment

What do you mean by inject every component @francoism90 ? Maybe adding every dialog component that can be opened to the <template></template>? Thats why I switched to dialog plugin instead of dialog components, because it was confusing to handle dialog show/hide state as the v-close.popup consumes the input event for @click button, so if you want to send data to parent you need to create a ref to your dialog component and call hide() manually after you emit any data, and with the plugin thats already enforced with the onOk callback so its more clear. Im also interested on this issue.

All 3 comments

What do you mean by inject every component @francoism90 ? Maybe adding every dialog component that can be opened to the <template></template>? Thats why I switched to dialog plugin instead of dialog components, because it was confusing to handle dialog show/hide state as the v-close.popup consumes the input event for @click button, so if you want to send data to parent you need to create a ref to your dialog component and call hide() manually after you emit any data, and with the plugin thats already enforced with the onOk callback so its more clear. Im also interested on this issue.

this.$q.dialog({...}) returns a chainable Object which also has the "hide()" method available. Does this answer your question?

@rstoenescu Yes it does. :)

Was this page helpful?
0 / 5 - 0 ratings