01 引言
在企业系统中，高效处理表格数据尤为重要。Choerodon UI 组件库的 Table 组件迎来升级，不仅提供功能丰富的筛选条，还新增了前端组合排序与筛选特性。用户无需频繁调用接口即可快速完成单列或多列的数据排序及筛选操作，这一改进显著减轻了网络负担，减少了加载时间，让信息提取更加迅速、灵活。
当然也可根据需求调整查询策略，选择当前页还是所有页数据进行排序、筛选。目前具有以下特性：
02 功能特点
1. 单列排序
简介：
Table 组件提供了开箱即用的排序功能，只需在列的配置项中设置 sortable 属性即可启用。
排序策略：
- 所有页排序：默认为所有页排序，切换改变升序/降序时，会调用查询接口，返回排序数据。
- 当前页排序：支持设置 sortable 属性为函数来自定义排序逻辑，个性化控制当前页数据排序。
操作步骤：
鼠标悬停列头，出现箭头图标，点击可轮流实现表格数据的 正序 -> 倒序 -> 无序 循环排序。
2. 多列排序
简介：
DataSet 数据源中配置 combineSort 属性，开启多列同时排序功能。在以往基础上，组件升级支持了当前页排序功能。
排序策略：
- 所有页排序：默认为所有页排序，可在弹窗中拖拽调整列排序优先级，选择正序、倒序，排序规则清晰明了。确定排序规则后，会调用查询接口，返回排序数据。
- 当前页排序 （新增） ：组件内置了当前页数据组合排序逻辑，开箱即用，数据加载零等待，灵活高效。当然，也可自定义实现组合排序逻辑，进行个性化控制。
Table 组件新增切换排序策略属性： 支持对组合排序项详细配置，设置当前页排序还是所有页排序，默认排序策略等等。
操作步骤：
点击表头的多列排序图标会弹出一个窗口，您可以在窗口中控制多个列字段的顺序和排序方式。
示例：选择排序策略为“当前页排序”，按照性别优先升序，性别相同时按照年龄降序。
优点：
多列之间排序优先级清晰，拖拽调整方便；当前页排序不用调用接口就能完成数据排序。大数据量表格中进行前端排序可减轻数据库查询压力，减少 loading，提升用户体验。
筛选模式：
- 单列筛选
- 列组合筛选 （新增）
简介：
Table 组件提供了内置列筛选器，开发者只需在列的配置项中设置 filter 属性，即可开启列筛选。默认开启列组合筛选。
由于数据筛选范围为当前页，无需发起网络请求，即使大数据量也能毫秒级完成响应。
自定义筛选函数 ：
还支持设置 filter 属性为函数来自定义筛选逻辑，可以对复杂单元格内容执行个性化筛选。
自定义筛选功能 ：
除可自定义筛选函数外，还可将整个筛选区域进行自定义，进行深度定制。
比如：实现数据的大于、等于、小于筛选操作，或者枚举值选择。
操作步骤 ：
点击列的筛选图标弹出操作窗口，输入搜索内容，点击搜索，即可快速筛选。开启组合筛选后，再对其他列筛选不会清除之前已筛选内容，达到多列同时筛选效果。
优点：
大数据量开启虚拟滚动场景中，能够快速筛选，即时反馈，多条件支持。
03 场景示例
案例背景:
某企业有上千名员工，企业系统中有一张包含所有员工数据的表格，列数多，且未做分页，开启了虚拟滚动。HR 想要快速筛选，以及多列排序。其中一个场景是：先对部门进行筛选，再按照性别优先排序，相同性别情况下按照年龄正序排序。
实现方案：
- 列配置 filter 和 sortable 属性，开启列筛选、排序功能
- 配置组合筛选：combineColumnFilter，组合排序属性：combineSort
- 选择默认排序策略为：当前页排序，采用内置的前端排序算法
实现效果：
- 开启列筛选和前端组合排序后，操作便捷灵活，每做一次操作，表格加载零等待，减少了页面的卡顿。
- 排序的优先级也明确清晰。
筛选
排序
效果
欢迎试用
我们将持续优化 Table 组件功能，优化客户体验。如果您有更好的想法和建议，欢迎您积极反馈给我们。
● Table
● github
立即预约，免费演示 👉 获取产品演示
