编写内容组件

版本

以 Markdown 格式查看

<Versions> 组件根据版本选择显示不同内容。用户可以使用下拉菜单在版本之间切换，选择的版本会持久化保存在 URL 查询参数中。

若要对整个文档站点进行版本控制，请使用站点级版本控制。您可以独立使用站点级版本控制和 <Versions> 组件，也可以同时使用。

用法

这是版本 2.0 的内容（默认版本）。选择时，URL 将显示 ?v=v2.0。

这是版本 1.0 的内容。选择时，URL 将显示 ?v=v1.0。

Markdown
1<Versions>
2  <Version version="v2.0" title="版本 2.0" default>
3    这是版本 2.0 的内容（默认版本）。选择时，URL 将显示 `?v=v2.0`。
4  </Version>
5  <Version version="v1.0" title="版本 1.0">
6    这是版本 1.0 的内容。选择时，URL 将显示 `?v=v1.0`。
7  </Version>
8</Versions>

变体

嵌套组件

您可以在每个版本中包含任何内容，包括代码块、标注和其他组件。

$npm install @fern/plant-sdk@2.0.0

版本 2.0 包含破坏性变更。请查看迁移指南。

$npm install @fern/plant-sdk@1.0.0
Markdown
1<Versions>
2  <Version version="v2" title="v2.0" default>
3    ```bash
4    npm install @fern/plant-sdk@2.0.0
5    ```
6    <Note>
7      版本 2.0 包含破坏性变更。请查看迁移指南。
8    </Note>
9  </Version>
10  <Version version="v1" title="v1.0">
11    ```bash
12    npm install @fern/plant-sdk@1.0.0
13    ```
14  </Version>
15</Versions>

自定义查询参数

默认情况下，选择的版本使用 v 查询参数存储在 URL 中。您可以使用 paramName 属性自定义此参数，以避免在同一页面上使用多个 <Versions> 组件时发生冲突。

当前 SDK 版本的内容。选择时，URL 将显示 ?sdk-version=current。

旧版 SDK 版本的内容。选择时，URL 将显示 ?sdk-version=legacy。

Markdown
1<Versions paramName="sdk-version">
2  <Version version="current" title="当前版本" default>
3    当前 SDK 版本的内容。选择时，URL 将显示 `?sdk-version=current`。
4  </Version>
5  <Version version="legacy" title="旧版本">
6    旧版 SDK 版本的内容。选择时，URL 将显示 `?sdk-version=legacy`。
7  </Version>
8</Versions>

属性

<Versions> 属性

paramName
stringDefaults to v

用于在 URL 中存储选定版本的查询参数名称。

className
string

应用到版本容器的附加 CSS 类。

<Version> 属性

version
stringRequired

版本标识符。在 <Versions> 组件内必须唯一。此值用于 URL 查询参数。

title
string

显示在下拉菜单中的标题。如果未指定，则使用 version 值。

default
boolean

当 URL 中未指定版本时，此版本是否应默认被选中。

children
string | JSXRequired

选择此版本时显示的内容。可以包含文本、Markdown 和组件。

className
string

应用到版本内容的附加 CSS 类。