November 9, 2025 | Fern Documentation

用于显示文件树结构的 Files 组件

全新的 <Files> 组件可以创建可视化的文件树结构，支持可展开的文件夹和嵌套文件。使用它来展示项目结构、目录布局或文档中的任何分层文件组织。

components

accordion.mdx

button.mdx

card.mdx

tabs.mdx

assets

markdown.mdx

README.md# 为文档做贡献

markdown.mdx

README.md

该组件包含三个部分：<Files> 作为容器，<Folder> 用于可展开或折叠的目录，<File> 用于单个文件。文件夹和文件支持可选的 href 属性以使其成为可点击链接，文件夹可以使用 defaultOpen 在页面加载时默认展开。

Markdown

<Files>
  <Folder name="components" highlighted defaultOpen>
    <File name="accordion.mdx" />
    <File name="button.mdx" />
    <File name="card.mdx" />
    <File name="tabs.mdx" />
  </Folder>
  <Folder name="assets">
    <File name="styles.css" />
  </Folder>
  <File name="markdown.mdx" href="/learn/docs/writing-content/markdown" />
  <File name="README.md" comment="Contribute to the docs"/>
  <File name="markdown.mdx" href="/learn/docs/writing-content/markdown-basics" />
  <File name="README.md" />
</Files>

阅读文档