代码抽屉
2 分
代码抽屉 区块会在双栏布局的右侧列显示请求示例和响应示例。请使用它们构建交互式 API 文档。
语法
您可以使用 Markdown 或 MDX 添加此组件。
::::CodeDrawer{title="Endpoint Name"}
:::CodeblockTabsExamples
(Code blocks with request examples)
:::
:::CodeblockTabsResponses
(Code blocks with response examples)
:::
::::代码抽屉包含两个部分:
- 代码块选项卡示例 用于请求示例。
- CodeblockTabsResponses 用于响应示例。
每个部分可以包含一个或多个围栏代码块。当存在多个代码块时,它们会自动分组为语言选项卡。
当在双栏布局中使用时,代码抽屉会渲染在右侧列。
MDX 示例
以下示例创建一个包含 JavaScript、Python 和 Bash 请求示例,以及成功和错误响应的代码抽屉。
<CodeDrawer title="Create a User">
<CodeblockTabsExamples>
```javascript
const response = await fetch('https://api.example.com/users', {
method: 'POST',
headers: {
'Content-Type': 'application/json',
'Authorization': 'Bearer sk_live_xxx'
},
body: JSON.stringify({
name: 'Jane Doe',
email: '[email protected]',
role: 'admin'
})
})
const user = await response.json()
```
```python
import requests
response = requests.post('https://api.example.com/users', json={
'name': 'Jane Doe',
'email': '[email protected]',
'role': 'admin'
}, headers={
'Authorization': 'Bearer sk_live_xxx'
})
user = response.json()
```
```bash
curl -X POST https://api.example.com/users \
-H "Content-Type: application/json" \
-H "Authorization: Bearer sk_live_xxx" \
-d '{"name":"Jane Doe","email":"[email protected]","role":"admin"}'
```
</CodeblockTabsExamples>
<CodeblockTabsResponses>
```json
{
"id": "usr_abc123",
"name": "Jane Doe",
"email": "[email protected]",
"role": "admin",
"createdAt": "2026-04-01T10:00:00Z"
}
```
```json
{
"error": "Validation failed",
"message": "Email already exists",
"code": 409
}
```
</CodeblockTabsResponses>
</CodeDrawer>Have a question?
Our super-smart AI, knowledgeable support team and an awesome community will get you an answer in a flash.
To ask a question or participate in discussions, you'll need to authenticate first.