index.md 1.53 KB
Newer Older
1 2 3 4
---
title: DescriptionList
subtitle: 描述列表
cols: 1
nikogu's avatar
nikogu committed
5
order: 4
6 7
---

8
成组展示多个只读字段,常见于详情页的信息展示。
9 10 11 12 13 14 15 16

## API

### DescriptionList

| 参数      | 说明                                      | 类型         | 默认值 |
|----------|------------------------------------------|-------------|-------|
| layout    | 布局方式                                 | Enum{'horizontal', 'vertical'}  | 'horizontal' |
ddcat1115's avatar
ddcat1115 committed
17
| col       | 指定信息最多分几列展示,最终一行几列由 col 配置结合[响应式规则](/components/DescriptionList#响应式规则)决定          | number(0 < col <= 4)  | 3 |
18 19
| title     | 列表标题                                 | ReactNode  | - |
| gutter    | 列表项间距,单位为 `px`                    | number  | 32 |
ddcat1115's avatar
ddcat1115 committed
20
| size     | 列表型号,可以设置为 `large` `small`        | string  | - |
21

ddcat1115's avatar
ddcat1115 committed
22 23 24 25 26 27 28 29
#### 响应式规则

| 窗口宽度             | 展示列数                                      | 
|---------------------|---------------------------------------------|
| `≥768px`           |  `col`                                       |
| `≥576px`           |  `col < 2 ? col : 2`                         |
| `<576px`           |  `1`                                         |

30 31 32 33 34 35 36 37
### DescriptionList.Description

| 参数      | 说明                                      | 类型         | 默认值 |
|----------|------------------------------------------|-------------|-------|
| term     | 列表项标题                                 | ReactNode  | - |