ui/docs/content/3.components/toast.md

description, links, navigation

description	links	navigation
A succinct message to provide information or feedback to the user.	label icon to Toast i-custom-radix-vue https://www.radix-vue.com/components/toast.html label icon to GitHub i-simple-icons-github https://github.com/nuxt/ui/tree/v3/src/runtime/components/Toast.vue	badge label Todo

Usage

Use the useToast composable to display a toast in your application.

::important Make sure to wrap your app with the App component which uses our Toaster component which uses the ToastProvider component from Radix Vue. ::

::tip{to="/components/app#props"} You can check the App component toaster prop to see how to configure the Toaster globally. ::

Title

Description

Icon

Avatar

Color

Variant

Close

Actions

Examples

API

Props

::component-props

ignore:

• as
• open
• defaultOpen
• to
• target
• active
• activeClass
• inactiveClass
• exactActiveClass
• ariaCurrentValue
• href
• rel
• noRel
• prefetch
• prefetchOn
• noPrefetch
• prefetchedClass
• replace
• exact
• exactQuery
• exactHash
• external

---

::

Theme

:component-theme