how to get custom emit on a dynamic dialog

[moh586]

Hi
I created a Component and It is work well, but I couldn't get my emit because the component created on the fly and located inside GDialogRoot .

[mrFANRA]

Hi I created a Component and It is work well, but I couldn't get my emit because the component created on the fly and located inside GDialogRoot .

Hi! Did you found solution? Can you show example?

[moh586]

Hi .Actually NO.I chenged the code. I just create a GDialog component and passed a callback as props to component and after confirm button pressed I call the callback.

…

On Wed, Mar 8, 2023, 11:22 PM Roman Fandeev ***@***.***> wrote: Hi I created a Component and It is work well, but I couldn't get my emit because the component created on the fly and located inside GDialogRoot . Hi! Did you found solution? — Reply to this email directly, view it on GitHub <#2 (comment)>, or unsubscribe <https://github.com/notifications/unsubscribe-auth/AB22TOM57LIDMGU4R4ASU6LW3DPOPANCNFSM55FA7K6Q> . You are receiving this because you modified the open/close state.Message ID: ***@***.***>

[MichaelGitArt]

@moh586
@mrFANRA

To receive some data from the dialog, I use such helper functions.

export const useRDialog = () => {
  const $dialog = inject(regdataDialogInjectionKey)!

  return {
    ...$dialog,
  }
}

/**
 * Helper composables for simple dialogs
 *
 * @param _$dialog dialog controller. If we don't use it inside the setup function, we should pass it manually
 */
export const useRConfirmDialog = (_$dialog?: IRDialog) => {
  const $dialog = _$dialog || useRDialog()

  /**
   * Run confirm dialog that returns some data
   * @param component dialog component. Should accept 'confirm' prop and run it on confirm
   * @param props any props to pass to the dialog component (except 'confirm')
   * @returns {Promise<T | null>} true if the user confirmed the dialog, null if the user canceled the dialog
   */
  const confirmWithData = async<T = any>(component: Component, props?: any): Promise<T | null> => {
    return new Promise((resolve) => {
      let confirmed = false

      $dialog.addDialog({
        component,
        props: {
          ...props,
          confirm: (data: T) => {
            confirmed = true
            resolve(data)
          },
        },

        onRemoveHook() {
          if (!confirmed) {
            resolve(null)
          }
        },
      })
    })
  }

  return {
    confirmWithData,
  }
}

Quite a simple usage without putting anything in the template.

Could be called even from the store with some additional modifications.