Components组件Base UIBase UI 组件
轻提示
在页面边缘展示短暂的操作反馈通知。
中文模式已适配导航、标题、简介、目录与常用章节名称。翻译状态:部分完成;技术正文目前仍为英文。
Loading JGuang UI example…
About
Sonner is built and maintained by emilkowalski.
安装
Command
Manual
Run the following command:
Use the JGuang UI Registry URL provided on /systems/jguang-ui#install.
Add the Toaster component.
import { Toaster } from "@/components/ui/sonner"
export default function RootLayout({ children }) {
return (
<html lang="en">
<head />
<body>
<main>{children}</main>
<Toaster />
</body>
</html>
)
}
安装以下依赖:
npm install sonner next-themes
将以下代码复制到你的项目中。
View complete source: components/ui/sonner.tsx
Add the Toaster component.
import { Toaster } from "@/components/ui/sonner"
export default function RootLayout({ children }) {
return (
<html lang="en">
<head />
<body>
<Toaster />
<main>{children}</main>
</body>
</html>
)
}
用法
import { toast } from "sonner"
toast("Event has been created.")
Types
Loading JGuang UI example…
Description
Loading JGuang UI example…
Position
Use the position prop to change the position of the toast.
Loading JGuang UI example…
API 参考
See the Sonner API Reference for more information.
来源: components/base/sonner.mdx
JGuang UI 技术文档。