---
group:
  title: 通用组件
  order: 2
title: StandardTablePro
order: 2
toc: content
---
#  StandardTablePro 综合表格

## 代码演示

* 筛选条件表单将由 `formItemGroup =  filter.formItemGroup + columns内配置formItem`

###  基本使用


<code hideactions='["CSB"]' src="../../src/StandardTablePro/demos/basic.tsx"></code>

###  接口请求
<code hideactions='["CSB"]' src="../../src/StandardTablePro/demos/fetchData.tsx"></code>

## API
| 参数      | 说明                                      | 类型         | 默认值 | 参考值 |
|----------|------------------------------------------|-------------|-------|-------|
| acceptType | 数据传参方式 |`data`,`fetchData`  | `data` |- |
| onChange | 分页、排序、筛选变化时触发 |`(pagination, filters, sorter, extra)=> void`  | - |- |
| filter | 筛选条件相关配置 | `Object` | `{formLayout: 'horizontal',FormItemGroup: []}` | - |
| onSubmit | 提交搜索时触发 | `(params: U) => void` | | - |
| onReset | 重置搜索时触发 | `() => void` | | - |
| filterFormRef | 获取表单实例 | - | `{current: { getFieldValue 等}}`| - |
| tableActionRef | 获取表格相关实例 | - | `{current: { pagination , keywords, dataSource等}}` | - |
| getDataSource | 实时获取表格内部数据 | `({pagination , keywords, list})=> void` | | - |
| 其他standardTable参数 | 参考[standardTable](/components/standard-table#api) |- | - | - |
| 其他参数 | 参考官网[table](https://ant.design/components/table-cn/#Table) |- | - | - |

### acceptType='fetchData' 专有API

| 参数      | 说明                                      | 类型         | 默认值 | 参考值 |
|----------|------------------------------------------|-------------|-------|-------|
| fetchData |  获取数据接口 | `async(parameter, updateKey, tableChangeParams)=> void` | - |parameter包含：页码信息、筛选条件、表格排序条件等；tableChangeParams是表格默认的onChange内的参数值 |
| fetchOptionName |  指定数据值字段名| `Object` | `{ dataKey: 'data', listKey: 'records', totalKey: 'total', currentKey: 'current', sizeKey: 'size' }` |接口返回按 `{ data: {records, total, current,size,pages等}}`  |
| localPageInfo |  基础页码字段值 |  `Object`| ` { current: 1, size: 10 }` |- |
| onAction |  触发加载事件 |  `(updateKey, params)=>void)`|  |- |
| defaultParams |  默认参数（只初始时使用） |  `Object`|  |- |

### columns 列参数配置 API
| 参数字段      | 说明  |   类型   |必选项| 参考值|
|----------|------|-------------|------|------|
| formItem | 字段作为筛选条件使用 | Object | 否 |- |
| 其他参数 | 参考[StandardTable columns](/components/standard-table#columns-列参数配置-api) |- | - | - |
| 其他参数 | 参考官网[table](https://ant.design/components/table-cn/#Table) |- | - | - |

### formItem API

| 参数字段      | 说明  |   类型   |必选项| 参考值|
|----------|------|-------------|------|------|
| label | 标签名称 | string | 否 |不配置则默认取column的title |
| fieldName | 标签字段名 | string | 否 |不配置则默认取column的key或dataIndex|
| type | 控件类型 | string | 否 |- |
| 其他参数 | 参考[FormItemGroup](/components/standard-filter#formitemgroup-api) |- | - | - |

### buttonGroup API
| 参数字段      | 说明  |   类型   |必选项|
|----------|------|-------------|------|
| name | 按钮文本 | String | 是 |
| type | 按钮类型 | String | 否 |
| icon | 图标类名(类型为String：带前缀时，需要用','隔开(如'speci,plus')，第一个值代表前缀，第二个值代表图标类名)，可参考[icon-api](/components/spec-icon#api) | String/ReactNode | 否 |
| fn | 按钮点击事件 | Function | 否 |
| code | 权限code(对应code配置的name优先级高于上面的name值) | String | 否 |
| exName | 当设置code时，会优先使用exName作为按钮上的文本显示值 | String | 否 |
| isHide | 是否隐藏当前按钮（类型为Function时，返回值为true或false） | Boolean/Function(text, record, rowIndex) |否 |
| disabled | 禁用当前按钮 | Boolean | 否 |
| 其他配置 | 参考[button-group](/other/button-group#options-api) | - | - |




### StandardTablePro  ref


| 参数      | 说明                                      | 类型         |  参考值 |
|----------|------------------------------------------|-------------|-------|
| tableInstance |表格ref  |  | `initialInstance` |
| filterInstance |筛选条件值表单相关 ref  |  | `getFieldValue 、setFields、setFieldValue、setFieldsValue`等 |



#### tableInstance

| 参数      | 说明                                      | 类型         |  参考值 |
|----------|------------------------------------------|-------------|-------|
| initialInstance |包含了原始antd的Table ref  | `nativeElement、scrollTo` |  [原始值说明](https://ant.design/components/table-cn#table-ref) |
| pagination ||  |  |
| dataSource | |  | |
| keywords |  | | |
| pageInfo | |  | |
| reload | |  | |