Skip to content

[useToast] include callback when dynamically creating toasts #4206

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom
Closed
neilmerton opened this issue May 22, 2025 · 3 comments
Closed

[useToast] include callback when dynamically creating toasts #4206

neilmerton opened this issue May 22, 2025 · 3 comments
Labels
enhancement New feature or request triage v3 #1289

Comments

@neilmerton
Copy link

neilmerton commented May 22, 2025 •
edited
Loading

Description

After using the Discord help area it seems that there's no callback function for dynamically created toasts (when using useToast composable).

IIRC this used to be possible with the previous major version of Nuxt UI (using Notification, I think).

Update: here's how it worked previously.

Additional context

It would be helpful to have the ability to have a callback option that could be used whenever a specific toast is cleared (when using useToast and the toast clears through it's own timeout or the use dismissing it using the close button).

The Discord AI helper suggested watching all the toasts array, and then reacting when one is removed. Doing this each time would become rather time consuming and repetitive.
@neilmerton neilmerton added enhancement New feature or request v3 #1289 triage labels May 22, 2025
@mhelbich mhelbich mentioned this issue May 23, 2025
Closed
8 tasks
@mhelbich
Copy link

Hi, I tried adding this in #4210 - first time for me, so please elaborate any issues! :)

@neilmerton
Copy link
Author

Hi, I tried adding this in #4210 - first time for me, so please elaborate any issues! :)

Thanks for this, much appreciated.

@benjamincanac
Copy link
Member

You can achieve this using the onUpdate:open function:

  useToast().add({
    title: 'Toast',
    description: 'This is the toast',
    'onUpdate:open'(open) {
      console.log(open)
    }
  })

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Assignees
No one assigned
Labels
enhancement New feature or request triage v3 #1289
Projects
None yet
Milestone
No milestone
Development

Successfully merging a pull request may close this issue.

feat(toast) Callback on Toast expiration mhelbich/ui
3 participants
@neilmerton @benjamincanac @mhelbich