手风琴
在你的文档中添加手风琴菜单
Install to your codebase
Easier customisation & control.
使用
🌐 Usage
基于 Radix UI 手风琴,适用于常见问题部分。
🌐 Based on Radix UI Accordion, useful for FAQ sections.
对于 @fumadocs/base-ui,这改为基于 Base UI。
在 MDX 文件中使用它,或作为普通的 React 组件使用。
🌐 Use it in MDX files or as a normal React component.
---
title: Hello World
---
import { Accordion, Accordions } from 'fumadocs-ui/components/accordion';
<Accordions type="single">
<Accordion title="我的标题">My Content</Accordion>
</Accordions>手风琴
🌐 Accordions
Prop
Type
手风琴
🌐 Accordion
Prop
Type
链接到手风琴
🌐 Linking to Accordion
你可以为手风琴指定一个 id。当用户导航到带有指定 id 哈希参数的页面时,手风琴将自动展开。
🌐 You can specify an id for accordion. The accordion will automatically open when the user is navigating to the page with the specified id in hash parameter.
<Accordions>
<Accordion title="我的标题" id="my-title">
My Content
</Accordion>
</Accordions>手风琴的默认值与标题相同。当存在 id 时,将使用 id 作为值。
Last updated on
