> ## Documentation Index
> Fetch the complete documentation index at: https://mintlify-mintlify-add-i-to-quickstart-8818.mintlify.site/llms.txt
> Use this file to discover all available pages before exploring further.

# 示例

> 在桌面设备的右侧边栏显示代码块

`<RequestExample>` 和 `<ResponseExample>` 组件会在右侧边栏显示代码块，形成双栏布局，使用户在滚动浏览内容时始终能看到示例。这些组件专为 API 文档设计，但适用于所有页面。

常见用例：

* 带有请求和响应示例的 API 端点文档
* 与说明性文本并排展示的配置示例
* 供用户在按步骤操作时参考的代码示例
* 教程中的前后对比示例

在移动设备上，`<RequestExample>` 和 `<ResponseExample>` 组件会显示为常规代码块，用户可以直接滚动略过。

<RequestExample>
  ```bash Request
    curl --request POST \
      --url https://dog-api.kinduff.com/api/facts
  ```
</RequestExample>

<ResponseExample>
  ```json Response
  { "status": "success" }
  ```
</ResponseExample>

<div id="requestexample">
  ## RequestExample
</div>

使用 `<RequestExample>` 将代码示例固定在右侧边栏。该组件与 [CodeGroup](/zh/components/code-groups) 类似，但会将代码显示在侧边栏中，而非内联显示。

你可以在单个 `<RequestExample>` 中包含多个代码块。每个代码块都必须包含一个 title 属性。

````mdx 请求示例
<RequestExample>

```bash 请求
  curl --request POST \
    --url https://dog-api.kinduff.com/api/facts
```

</RequestExample>
````

<div id="responseexample">
  ## ResponseExample
</div>

`<ResponseExample>` 组件会将代码示例固定在右侧边栏中，位于同一页面中任何 `<RequestExample>` 内容的下方。

````mdx 响应示例
<ResponseExample>

```json 响应
{ "status": "success" }
```

</ResponseExample>
````