> ## Documentation Index
> Fetch the complete documentation index at: https://help.dingtalk.io/llms.txt
> Use this file to discover all available pages before exploring further.

# TablePc 表格

> TablePc 表格组件详细文档，涵盖数据源绑定、排序、过滤、锁列等能力的属性与事件说明，是列表数据展示的核心组件。

展示行列数据。

## 何时使用

* Table 负责将数据呈现为高度可定制和具备可访问性的 HTML 表格，其核心功能为将结构化的数据使用表格的方式展现;
* 可以使用各种参数来向表格中加入一些特性，比如排序，过滤，滚动，锁列等。

## 组件示例

<iframe src="https://www.aliwork.com/developer/table-pc-v2?isRenderNav=false" width="100%" height="480" frameBorder="0" />

## 组件属性

| 属性                         | 说明                                                                 | 类型                                                                                              | 默认值                                                                           |
| -------------------------- | ------------------------------------------------------------------ | ----------------------------------------------------------------------------------------------- | ----------------------------------------------------------------------------- |
| `actionBar`                | 设置顶部操作-操作条                                                         | `array`                                                                                         | `[{title: {zh_CN: '操作1',en_US: 'Action 1',type: 'i18n'},option: 'callback'}]` |
| `actionFixed`              | 设置操作列列固定                                                           | `string`                                                                                        | `'none'`                                                                      |
| `actionHidden`             | 设置操作列是否隐藏                                                          | `boolean`                                                                                       | `false`                                                                       |
| `actionTitle`              | 设置操作列标题                                                            | `string`                                                                                        | `'操作'`                                                                        |
| `actionType`               | 设置操作列按钮类型                                                          | `string`                                                                                        | `'link'`                                                                      |
| `actionWidth`              | 设置操作列宽度                                                            | `number`                                                                                        | `0`                                                                           |
| `cellProps`                | 设置风格和样式-单元格分割合并                                                    | `(rowIndex: number,colIndex: number,dataIndex: number,record: object)=>void`                    | -                                                                             |
| `columnProps`              | 设置行选择器-选择列属性                                                       | `() => void`                                                                                    | -                                                                             |
| `columns`                  | 可通过绑定数据源设置数据列                                                      | [TableColumn\[\]](/zh/open/yida/components/interface#tablecolumn)                               | -                                                                             |
| `data`                     | 数据源                                                                | `any[]`                                                                                         | -                                                                             |
| `dataSourceType`           | 数据源类型                                                              | `'data' \| 'url'`                                                                               | `'data'`                                                                      |
| `device`                   | 设置操作项-在特定端显示                                                       | `string`                                                                                        | -                                                                             |
| `emptyContent`             | 设置风格和样式-空数据渲染                                                      | `() => ReactNode`                                                                               | -                                                                             |
| `expandedRowIndent`        | 设置可折叠/树形表格-启用折叠,额外渲染行的缩进                                           | `array`                                                                                         | `[]`                                                                          |
| `expandedRowRender`        | 设置可折叠/树形表格-启用折叠,额外渲染行的渲染函数                                         | `(record: object, index: number) => ReactNode`                                                  | -                                                                             |
| `fixedHeader`              | 设置风格和样式-表头是否固定                                                     | `boolean`                                                                                       | `true`                                                                        |
| `getExpandedColProps`      | 设置可折叠/树形表格-启用折叠,设置额外渲染行的属性                                         | `(record: object, index: number) => ReactNode`                                                  | -                                                                             |
| `getProps`                 | 设置行选择器-选择器属性                                                       | `(rowData: object, index: number) => void`                                                      | -                                                                             |
| `hasExpandedRowCtrl`       | 设置可折叠/树形表格-启用折叠,折叠按钮                                               | `boolean`                                                                                       | `true`                                                                        |
| `hasHeader`                | 设置风格和样式-显示表头                                                       | `boolean`                                                                                       | `true`                                                                        |
| `isDisabled`               | 设置顶部操作-操作条页面跳转,是否禁用                                                | `boolean`                                                                                       | -                                                                             |
| `isExpand`                 | 设置可折叠/树形表格-启用折叠                                                    | `boolean`                                                                                       | `false`                                                                       |
| `isPagination`             | 分页设置-使用分页                                                          | `boolean`                                                                                       | `true`                                                                        |
| `isPagination`             | 分页设置-当分页数为1时，是否隐藏分页器                                               | `boolean`                                                                                       | `false`                                                                       |
| `isTree`                   | 设置可折叠/树形表格-启用树形                                                    | `boolean`                                                                                       | `false`                                                                       |
| `loading`                  | 是否处于加载状态                                                           | `boolean`                                                                                       | `false`                                                                       |
| `loadingComponent`         | 设置风格和样式-设置loading组件                                                | `()=>ReactNode`                                                                                 | -                                                                             |
| `maxBodyHeight`            | 设置风格和样式-表头是否固定,最大内容区域的高度                                           | `number`                                                                                        | `0`                                                                           |
| `maxWebShownActionCount`   | 设置最大展示数量                                                           | `number`                                                                                        | `3`                                                                           |
| `mobileActionsStyle`       | 手机端特有配置-设置展开方式,操作风格                                                | `string`                                                                                        | -                                                                             |
| `mobileDefaultCardColumns` | 手机端特有配置-展开方式,默认字段数                                                 | `string`                                                                                        | `4`                                                                           |
| `mobileExpanViewMode`      | 手机端特有配置-展开方式                                                       | `string`                                                                                        | `normal`                                                                      |
| `mobileMargin`             | 手机端特有配置-设置默认外边距                                                    | `number`                                                                                        | `0`                                                                           |
| `mobileMode`               | 手机端特有配置-展示风格                                                       | `string`                                                                                        | `normal`                                                                      |
| `mode`                     | 设置操作项-在编辑状态显示                                                      | `string`                                                                                        | `'VIEW'`                                                                      |
| `mode`                     | 设置行选择器-类型                                                          | `'single' \| 'multiple'`                                                                        | `'multiple'`                                                                  |
| `noPadding`                | 高级-设置隐藏边距                                                          | `boolean`                                                                                       | `false`                                                                       |
| `onCellDataChange`         | 动作设置-编态数据发生变化时触发                                                   | `({data: object}) => void`                                                                      | -                                                                             |
| `onChange`                 | 设置行选择器-选择变动回调                                                      | `(selectedRowKeys: array,records: array)=>void`                                                 | -                                                                             |
| `onColumnsChange`          | 设置顶部操作-列筛选器回调                                                      | `(columns: object)=>void`                                                                       | -                                                                             |
| `onFetchData`              | 动作设置-分页、搜索、排序时触发                                                   | `({params: object}) => void`                                                                    | -                                                                             |
| `onResizeChange`           | 动作设置-重设列尺寸的时候触发的事件                                                 | `({dataIndex: string, value:number}) => void`                                                   | -                                                                             |
| `onRowClick`               | 动作设置-点击表格每一行触发的事件                                                  | `({record: object, index:number, evt:object}) => void`                                          | -                                                                             |
| `onRowMouseEnter`          | 动作设置-悬浮在表格每一行的时候触发的事件                                              | `({record: object, index: number, evt: object}) => void`                                        | -                                                                             |
| `onRowMouseLeave`          | 动作设置-离开表格每一行的时候触发的事件                                               | `({record: object, index:number, evt:object}) => void`                                          | -                                                                             |
| `onRowOpen`                | 设置可折叠/树形表格-启用折叠,展开收起时触发的事件                                         | `(openRowKeys: array, currentRowKey: string, expanded: boolean, currentRecord: object) => void` | -                                                                             |
| `onSelect`                 | 设置行选择器-单行选择回调                                                      | `({selected: boolean,rowData: object,selectedRows: array})=>void`                               | -                                                                             |
| `onSelectAll`              | 设置行选择器-全部选择回调                                                      | `(selected: boolean,selectedRows: array)=>void`                                                 | -                                                                             |
| `openRowKeys`              | 设置可折叠/树形表格-启用折叠,默认展开渲染的行                                           | `string[]`                                                                                      | -                                                                             |
| `pageMode`                 | 设置顶部操作-操作条页面跳转,关联页面状态                                              | `string`                                                                                        | -                                                                             |
| `pageShowCount`            | 分页设置-页码显示数量                                                        | `number`                                                                                        | `5`                                                                           |
| `pageSize`                 | 分页设置-pageSize                                                      | `number`                                                                                        | `10`                                                                          |
| `pageSizeList`             | 分页设置-每页显示选择器可选值                                                    | `array`                                                                                         | `[5,10,20]`                                                                   |
| `pageSizePosition`         | 分页设置-每页显示选择器在组件中的位置                                                | `string`                                                                                        | `'end'`                                                                       |
| `pageSizeSelector`         | 分页设置-每页显示选择器类型                                                     | `boolean`                                                                                       | `false`                                                                       |
| `pagination`               | 分页设置-分页位置                                                          | `string`                                                                                        | `'right'`                                                                     |
| `primaryKey`               | 设置数据主键，数据主键用于区分数据中不同的行，对行选择和行编辑功能非常重要，不同的行主键值不可重复，一般采用数据库中自增 ID 字段 | `string`                                                                                        | `'id'`                                                                        |
| `render`                   | 设置操作项-定制渲染                                                         | `(title: object,rowData: object)=>{title}`                                                      | -                                                                             |
| `rowProps`                 | 设置风格和样式-单元格行属性配置                                                   | `(record: object,index: number)=>void`                                                          | -                                                                             |
| `searchBarPlaceholder`     | 设置顶部操作-显示搜索条占位符                                                    | `string`                                                                                        | `'请搜索'`                                                                       |
| `selectedRowKeys`          | 设置行选择器-已选中的行                                                       | `string[]`                                                                                      | -                                                                             |
| `setEmptyContent`          | 设置风格和样式-自定义空数据渲染                                                   | `boolean`                                                                                       | `false`                                                                       |
| `setLoadingComponent`      | 设置风格和样式-自定义loading组件                                               | `boolean`                                                                                       | `false`                                                                       |
| `shape`                    | 分页设置-前进后退按钮样式                                                      | `string`                                                                                        | `arrow-only`                                                                  |
| `showActionBar`            | 设置顶部操作-显示操作条                                                       | `boolean`                                                                                       | `true`                                                                        |
| `showCustomBarItem`        | 设置顶部操作-显示自定义区域                                                     | `boolean`                                                                                       | `false`                                                                       |
| `showCustomCoulmn`         | 设置顶部操作-显示列筛选器                                                      | `boolean`                                                                                       | `false`                                                                       |
| `showCustomCoulmn`         | 设置顶部操作-自定义区域渲染                                                     | `()=>void`                                                                                      | -                                                                             |
| `showLinkBar`              | 设置顶部操作-是否显示外链条                                                     | `boolean`                                                                                       | `true`                                                                        |
| `showMiniPager`            | 分页设置-是否显示顶部的迷你分页(仅对 PC 端渲染有效)                                      | `boolean`                                                                                       | `false`                                                                       |
| `showRowSelector`          | 设置行选择器-是否显示                                                        | `boolean`                                                                                       | `false`                                                                       |
| `showSearch`               | 设置顶部操作-显示搜索条                                                       | `boolean`                                                                                       | `true`                                                                        |
| `size`                     | 分页设置-分页尺寸                                                          | `string`                                                                                        | `'medium'`                                                                    |
| `stickyHeader`             | 设置风格和样式-表头是否是sticky                                                | `boolean`                                                                                       | `false`                                                                       |
| `theme`                    | 设置风格和样式-主题                                                         | `string`                                                                                        | `'split'`                                                                     |
| `title`                    | 设置操作项-标题                                                           | `string`                                                                                        | `'详情'`                                                                        |
| `title`                    | 设置顶部操作-操作条标题                                                       | `string`                                                                                        | `'操作'`                                                                        |
| `title`                    | 设置顶部操作-外链操作条,外链操作标题                                                | `string`                                                                                        | `'外链操作'`                                                                      |
| `titleAddons`              | 设置行选择器-选择列列标题元素                                                    | `(rowData: object,index: number) => ReactNode`                                                  | -                                                                             |
| `titleProps`               | 设置行选择器-选择列列标题属性                                                    | `(rowData: object, index: number) => void`                                                      | -                                                                             |
| `type`                     | 分页设置-分页类型                                                          | `string`                                                                                        | `'normal'`                                                                    |
| `useStickyLock`            | 高级-设置列固定优化                                                         | `boolean`                                                                                       | `false`                                                                       |
| `useVirtual`               | 设置风格和样式-虚拟滚动                                                       | `boolean`                                                                                       | `false`                                                                       |