简单的表格，最后一列是各种操作。

使用 JSX 风格的 API（2.5.0 以后引入）

这个只是一个描述 columns 的语法糖，所以你不能用其他组件去包裹 Column 和 ColumnGroup。

第一列是联动的选择框。可以通过 rowSelection.type 属性指定选择类型，默认为 checkbox。

默认点击 checkbox 触发选择行为，需要点击行触发可以参考例子：https://codesandbox.io/s/000vqw38rl

选择后进行操作，完成后清空选择，通过 rowSelection.selectedRowKeys 来控制选中项。

通过 rowSelection.selections 自定义选择项，默认不显示下拉选项，设为 true 时显示默认选择项。

对某一列数据进行筛选，使用列的 filters 属性来指定需要筛选菜单的列，onFilter 用于筛选当前数据，filterMultiple 用于指定多选和单选。

使用 defaultFilteredValue 属性，设置列的默认筛选项。

对某一列数据进行排序，通过指定列的 sorter 函数即可启动排序按钮。sorter: function(rowA, rowB) { ... }， rowA、rowB 为比较的两个行数据。

sortDirections: ['ascend' | 'descend']改变每列可用的排序方式，切换排序时按数组内容依次切换，设置在 table props 上时对所有列生效。你可以通过设置 ['ascend', 'descend', 'ascend'] 禁止排序恢复到默认状态。

使用 defaultSortOrder 属性，设置列的默认排序顺序。

如果 sortOrder 或者 defaultSortOrder 的值为 ascend 或者 descend，则可以通过 sorter 的函数第三个参数获取当前排序的状态。该函数可以是 function(a, b, sortOrder) { ... } 的形式。

可以使用 filterMode 来修改筛选菜单的 UI，可选值有 menu（默认）和 tree。

filterSearch 用于开启筛选项的搜索，通过 filterSearch:(input, record) => boolean 设置自定义筛选方法

column.sorter 支持 multiple 字段以配置多列排序优先级。通过 sorter.compare 配置排序逻辑，你可以通过不设置该函数只启动多列排序的交互形式。

使用受控属性对筛选和排序状态进行控制。

1. columns 中定义了 filteredValue 和 sortOrder 属性即视为受控模式。
2. 只支持同时对一列进行排序，请保证只有一列的 sortOrder 属性是生效的。
3. 务必指定 column.key。

通过 filterDropdown 自定义的列筛选功能，并实现一个搜索列的示例。

给函数 clearFilters 添加 boolean 类型参数 closeDropdown，是否关闭筛选菜单，默认为 true。添加 boolean 类型参数 confirm，清除筛选时是否提交已选项，默认 true。

这个例子通过简单的 ajax 读取方式，演示了如何从服务端读取并展现数据，具有筛选、排序等功能以及页面 loading 效果。开发者可以自行接入其他数据处理方式。

另外，本例也展示了筛选排序功能如何交给服务端实现，列不需要指定具体的 onFilter 和 sorter 函数，而是在把筛选和排序的参数发到服务端来处理。

当使用 rowSelection 时，请设置 rowSelection.preserveSelectedRowKeys 属性以保留 key。

注意，此示例使用 模拟接口，展示数据可能不准确，请打开网络面板查看请求。

🛎️ 想要 3 分钟实现？试试 ProTable！

两种紧凑型的列表，小型列表只用于对话框内。

添加表格边框线，页头和页脚。

当表格内容较多不能一次性完全展示时。

你可以通过 Table.EXPAND_COLUMN 和 Table.SELECT_COLUMN 来控制选择和展开列的顺序。

表头只支持列合并，使用 column 里的 colSpan 进行设置。

表格支持行/列合并，使用 render 里的单元格属性 colSpan 或者 rowSpan 设值为 0 时，设置的表格不会渲染。

表格支持树形数据的展示，当数据中有 children 字段时会自动展示为树形表格，如果不需要或配置为其他字段可以用 childrenColumnName 进行配置。

可以通过设置 indentSize 以控制每一层的缩进宽度。

方便一页内展示大量数据。

需要指定 column 的 width 属性，否则列头和内容可能不对齐。如果指定 width 不生效或出现白色垂直空隙，请尝试建议留一列不设宽度以适应弹性布局，或者检查是否有超长连续字段破坏布局。

对于列数很多的数据，可以固定前后的列，横向滚动查看其它数据，需要和 scroll.x 配合使用。

若列头与内容不对齐或出现列重复，请指定固定列的宽度 width。如果指定 width 不生效或出现白色垂直空隙，请尝试建议留一列不设宽度以适应弹性布局，或者检查是否有超长连续字段破坏布局。

建议指定 scroll.x 为大于表格宽度的固定值或百分比。注意，且非固定列宽度之和不要超过 scroll.x。

注意：v4 版本固定列通过 sticky 实现，IE 11 会降级成横向滚动。

适合同时展示有大量数据和数据列。

若列头与内容不对齐或出现列重复，请指定固定列的宽度 width。如果指定 width 不生效或出现白色垂直空隙，请尝试建议留一列不设宽度以适应弹性布局，或者检查是否有超长连续字段破坏布局。

建议指定 scroll.x 为大于表格宽度的固定值或百分比。注意，且非固定列宽度之和不要超过 scroll.x。

columns[n] 可以内嵌 children，以渲染分组表头。

带单元格编辑功能的表格。当配合 shouldCellUpdate 使用时请注意闭包问题。

带行编辑功能的表格。

🛎️ 想要 3 分钟实现？试试 ProTable 的可编辑表格！

展示每行数据更详细的信息。

使用自定义元素，我们可以集成 dnd-kit 来实现拖拽排序。

使用 dnd-kit 来实现一个拖拽操作列。

设置 column.ellipsis 可以让单元格内容根据宽度自动省略。

列头缩略暂不支持和排序筛选一起使用。

设置 column.ellipsis.showTitle 关闭单元格内容自动省略后默认的 title 提示, 使用 Tooltip 替代。

通过 summary 设置总结栏。使用 Table.Summary.Cell 同步 Column 的固定状态。你可以通过配置 Table.Summary 的 fixed 属性使其固定(4.16.0 支持)。

响应式配置列的展示。

表格的分页设置。

对于长表格，需要滚动才能查看表头和滚动条，那么现在可以设置跟随页面固定表头和滚动条。

选择不同配置组合查看效果。