用途:在 shadcn ui 项目中添加、调试或迁移通知提示(toast)。按资料说明,2026 年起 Sonner 是 shadcn ui 唯一的通知提示原语,旧 Radix 版 Toast 组件与 useToast() 钩子已被移除。
主要能力:在应用根挂载一次 <Toaster /> 作为视口;在客户端组件中通过从 sonner 顶层导入的 toast() 触发提示,支持 toast.success / error / warning / info / loading / message、toast.promise、toast.custom、toast.dismiss(id) 等方法。toast() 为同步、fire-and-forget,返回数值 id 以便更新或关闭。
必要用法:根布局中从 "@/components/ui/sonner" 引入 <Toaster />,放在 children 之后;触发处使用 "use client" 并 import { toast } from "sonner"(不要从 @/components/ui/sonner 导入 toast)。toast.promise 需同时传 loading、success、error 三态。每应用只挂载一个 <Toaster />,避免重复。
迁移:删除 components/ui/use-toast.ts、toast.tsx、旧 toaster.tsx;运行 pnpm dlx shadcn@latest add sonner;将 const { toast } = useToast() 替换为顶层导入,toast({title}) 改为 toast.success(...) 等。
限制:资料暂未提供价格、平台、效果或版本以外的细节;主题依赖 next-themes,若未使用需安装或改写主题调用。