ProTable - 高级表格

ProTable 的诞生是为了解决项目中需要写很多 table 的样板代码的问题，所以在其中做了封装了很多常用的逻辑。这些封装可以简单的分类为预设行为与预设逻辑。

引入方法: import { ProTable } from 'eat-design';

文档：

ProTable 属性

| 属性 | 描述 | 类型 | 默认值 | |--------------|---------------------------------------|----------------|-----------| | request | 获取 dataSource 的方法 | (params?: {pageSize,current},sort,filter)=> {data,success,total} | - | | params| 用于 request 查询的额外参数，一旦变化会触发重新加载 | object | | tableConfig| 用于 table配置继承自elemelt-plus | object | Table | | columns | Table 的数据，ProTable 推荐使用 request 来加载 | T[] | — | | rowSelection | Table 的数据，ProTable 推荐使用 request 来加载 | T[] | — | | ref |Table action 的引用，便于自定义触发 | - | — | | expand | 是否展开 | boolean | false | | persistenceType |持久化列的类型，localStorage 设置在关闭浏览器后也是存在的，sessionStorage 关闭浏览器后会丢失 | localStorage 或 sessionStorage | — | | persistenceKey | 持久化列的 key，用于判断是否是同一个 table | string 或 number | — |

columns 属性

| 属性 | 描述 | 类型 | 默认值 | |--------------|---------------------------------------|----------------|-----------| | title | 表格标题 | string | - | | key| vue 需要的 key | string |- | | columnsProps| Table-column API 继承自elemelt-plus | object | table-column-api | | showOverflowTooltip | 字符超长隐藏 | boolean | false | | fixed | （IE 下无效）列是否固定，可选 left right | boolean |— | | width |Table action 的引用，便于自定义触发 | string | — | | showInSearch | 是否展示在搜索表达 | boolean | false | | valueType | 搜索表单展示类型，select input daterange | string| — | | searchConfig | 表单项配置sort (排序 number) label (label配置 string) | object | — |

ref 手动触发

有时我们要手动触发 table 的 reload 等操作，可以使用 actionRef，可编辑表格也提供了一些操作来帮助我们更快地实现需求。

<ProTable ref={ref} />;
// 刷新
ref.current.reload();
// 刷新并清空,页码也会重置，不包括表单
ref.current.reloadAndRest();
// 重置到默认值，包括表单
ref.current.reset();