ProComponents Guide & Documentation
当用户询问 Ant Design Pro 组件、构建后台页面或需要查找具体组件参数时，请参考以下目录。 关键指令：如果需要编写详细代码且不确定某个 Props（如 request 的返回值格式、columns 的具体配置），请使用浏览工具（Browsing Tool）读取对应的 URL。
- Layout 布局组件
核心组件: ProLayout
-
文档链接: https://pro-components.antdigital.dev/components/layout
-
包含:
-
ProLayout : 解决侧边栏、顶部导航、面包屑等全局布局。
-
PageContainer : 页面的标准容器，自动生成面包屑和标题。
-
FooterToolbar : 底部固定工具栏。
-
WaterMark : 水印组件。
- Table 表格与列表
核心组件: ProTable
-
ProTable (超级表格):
-
文档链接: https://pro-components.antdigital.dev/components/table
-
用途: 包含查询表单、工具栏、表格体的全功能表格，CRUD 标配。
-
EditableProTable (可编辑表格):
-
文档链接: https://pro-components.antdigital.dev/components/editable-table
-
用途: 行内编辑、实时保存。
-
DragSortTable (拖拽排序):
-
文档链接: https://pro-components.antdigital.dev/components/drag-sort-table
-
ProList (高级列表):
-
用途: 卡片列表、文章列表，支持展开、选择。
- Form 表单组件
核心组件: ProForm
-
通用表单 (ProForm, ModalForm, DrawerForm, StepsForm):
-
用途:
-
ProForm : 标准页面表单。
-
ModalForm : 弹窗表单。
-
DrawerForm : 抽屉表单。
-
StepsForm : 分步表单。
-
LoginForm : 登录页专用。
-
SchemaForm (JSON配置表单):
-
文档链接: https://pro-components.antdigital.dev/components/schema-form
-
QueryFilter (筛选表单):
-
文档链接: https://pro-components.antdigital.dev/components/query-filter
- Data Display 数据展示
-
ProCard (高级卡片):
-
用途: 页面切分、分栏布局、栅格布局。
-
ProDescriptions (定义列表):
-
文档链接: https://pro-components.antdigital.dev/components/descriptions
-
用途: 详情页展示，支持 columns 定义。
-
StatisticCard (指标卡):
-
文档链接: https://pro-components.antdigital.dev/components/statistic-card
- Other 其他
-
ProSkeleton (骨架屏):
-
文档链接: https://pro-components.antdigital.dev/components/skeleton
-
ProField (原子组件):
-
文档链接: https://pro-components.antdigital.dev/components/field
-
用途: 根据 valueType 渲染只读/编辑模式的原子组件。
最佳实践提醒
-
Request 模式: ProTable 和 ProForm 推荐使用 request 属性配合 async 函数来接管数据加载，而不是手动管理 loading 和 data state。详情请查阅 ProTable 文档中的 request 部分。
-
ValueType: 善用 valueType ('money', 'date', 'select' 等) 来自动格式化显示和表单项，减少手写 render 代码。