1.2.5 • Published 6 years ago
category: Components
type: 数据展示
title: ExTable
subtitle: 表格组件
modifiedJs: 1
order: 6
cols: 1
扩展table组件。
用于整屏显示的表格页面
何时使用
- 表格需要支持在窗口缩放时能跟着缩放且页面不复杂,主要使用在 table 页面。
注意事项
API
BaseTable 列表
| 参数 | 说明 | 类型 | 默认值 |
|---|
| extraHeight | table 的分页下面的高度 | number | 0 |
特别说明:table 默认高度计算公式:table 高度=浏览器高度-table 距离文档顶部的高度-extraHeight;
FilterTable 列表
| 参数 | 说明 | 类型 | 默认值 |
|---|
| filter | 是否需要筛选列 | boolean | true |
| filterList | 筛选表头的数据来源,子项为表头column一一对应的普通对象,key、required、selected为必填字段,若column子项中有fixed属性,必须映射到对应的filterList子项上。 | 数组 | |
| onFilterSave | 筛选框保存时的回调函数,可以获取最新的filterList和表头数组 | function | |
| extraHeight | table 的分页下面的高度 | number | 0 |
| sortWarnText | 搜索时拖拽排序的文字警告 | string | "不可在搜索时进行拖拽" |
特别说明:不支持有列 fix 定位;且每项必传 width;
TableBottomActions 批量操作
| 参数 | 说明 | 类型 | 默认值 |
|---|
| selects | 选中项数,不传则不显示 | number | |
| showButtons | 显示按钮数量,包含更多下拉框,当 isMore 属性为 true | number | 3 |
| contents | 按钮文案及点击事件的回调 | 数组 | [] |
| showTotalRender | 总条数 | string | '' |
| isMore | 是否出现更多按钮 | boolean | true |
Filter 筛选
| 参数 | 说明 | 类型 | 默认值 |
|---|
| className | class | string | |
| handleFilter | 查询的回调。fields 是控件的值。 type 有两个值,分别为 normal 和 advanced。normal 是查询左侧普通搜索和更多搜索,advanced 是查询高级搜索。 | function(fields, type) {} | |
| resetNormalFilter | 普通搜索和更多搜索-点击重置的回调 | function() {} | |
| collapseMoreFilter | 更多搜索-点击展开收起回调,type 有两个值,分别为 show 和 hide 。用来区分是收起还是展开。 | function(type) {} | |
| cancelMoreFilter | 更多搜索-取消回调 | function() {} | |
| collapseAdvancedFilter | 高级搜索-点击展开收起回调,type 有两个值,分别为 show 和 hide 。用来区分是收起还是展开。 | function(type) {} | |
| resetAdvancedFilter | 高级搜索-重置回调 | function() {} | |
| cancelAdvancedFilter | 高级搜索-取消回调 | function() {} | |
***特别提示:Filter 组件外不可以有 Form 组件包裹。***
NormalFilter.Item 左侧普通搜索
| 参数 | 说明 | 类型 | 默认值 |
|---|
| label | label 标签的文本 | string | |
| initialValue | 初始值,若同时在 fieldOptions 中设置了 initialValue ,则会是 fieldOptions 中的 initialValue 生效 | string | |
| field | 必填输入控件唯一标志;同 getFieldDecorator(id, options) 中的 id | string | |
| fieldOptions | 同 getFieldDecorator(id, options) 中的 options | Object | |
在左侧普通搜索中使用多选框的时候,多选框下拉框的父级为 NormalFilter.Item;
MoreFilter 更多搜索
| 参数 | 说明 | 类型 | 默认值 |
|---|
| formItemLayout | 布局;labelCol 为 label 标签布局;wrapperCol 为输入控件布局 | object | { labelCol: 4, wrapperCol: 20 } |
| configWidth | 弹出框的宽度 | number | 500 |
MoreFilter.Item 更多搜索
| 参数 | 说明 | 类型 | 默认值 |
|---|
| label | label 标签的文本 | string | |
| initialValue | 初始值,若同时在 fieldOptions 中设置了 initialValue ,则会是 fieldOptions 中的 initialValue 生效 | string | |
| field | 必填输入控件唯一标志;同 getFieldDecorator(id, options) 中的 id | string | |
| fieldOptions | 同 getFieldDecorator(id, options) 中的 options | Object | |
AdvancedFilter 高级搜索
| 参数 | 说明 | 类型 | 默认值 |
|---|
| configWidth | 弹出框的宽度 | number | 500 |
| footer | 在查询、重置、取消上面的操作区域 | string | ReactNode | - |
AdvancedFilter.Item 高级搜索
| 参数 | 说明 | 类型 | 默认值 |
|---|
| label | label 标签的文本 | string | |
| labelSpan | label 标签布局 | number | 4 |
| colon | 配合 label 属性使用,表示是否显示 label 后面的冒号 | boolean | true |
AdvancedFilter.Item 里的 children
| 参数 | 说明 | 类型 | 默认值 |
|---|
| span | 输入控件布局 | number | 7 |
| initialValue | 初始值,若同时在 fieldOptions 中设置了 initialValue ,则会是 fieldOptions 中的 initialValue 生效 | string | |
| field | 必填输入控件唯一标志;同 getFieldDecorator(id, options) 中的 id | string | |
| fieldOptions | 同 getFieldDecorator(id, options) 中的 options | Object | |