Accordion — 折叠面板

Accordion 用于可折叠的内容区域，适合 FAQ、可选阅读等场景，支持手风琴模式和多开模式。

218 字1 分钟

Accordion 用于可折叠的内容区域，适合 FAQ、可选阅读等场景。

jsx

<Accordion><AccordionItem title="什么是 MDX？">MDX 是 Markdown 的超集，允许在 Markdown 文档中直接使用 JSX 组件。</AccordionItem><AccordionItem title="为什么要自定义组件？">原生 Markdown 只支持有限的 HTML 标签，无法实现复杂交互。通过自定义组件，可以统一设计语言、增强内容表现力。</AccordionItem></Accordion>

实际效果：

MDX 是 Markdown 的超集，允许在 Markdown 文档中直接使用 JSX 组件。

原生 Markdown 只支持有限的 HTML 标签，无法实现复杂交互。通过自定义组件，可以统一设计语言、增强内容表现力。

多个折叠面板默认只展开一个（手风琴模式），支持同时展开多个。

概览

4 / 14

1.Badge — 状态徽章 2.Callout — 提示卡片 3.Steps / Step — 步骤指引 4.Accordion — 折叠面板 5.Card / CardGrid — 卡片布局 6.Tree / TreeItem — 树形结构 7.Mermaid — 图表渲染 8.Embed — 外部内容嵌入 9.数学公式 10.ImageZoom — 图片放大 11.标题自动锚点 12.PrevNext — 上下篇导航 13.LastUpdated — 更新时间 14.HTML 元素覆盖

Steps / Step — 步骤指引 Card / CardGrid — 卡片布局