x-next 1.13.0 → 1.14.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (138) hide show
  1. package/AI_CODING.md +6 -5
  2. package/AI_USAGE/catalog.md +106 -105
  3. package/AI_USAGE/components/alert-api.md +48 -0
  4. package/AI_USAGE/components/alert.md +222 -3
  5. package/AI_USAGE/components/bar-chart-api.md +177 -0
  6. package/AI_USAGE/components/bar-chart.md +297 -3
  7. package/AI_USAGE/components/boxicons.md +147 -0
  8. package/AI_USAGE/components/button-api.md +144 -0
  9. package/AI_USAGE/components/button.md +447 -3
  10. package/AI_USAGE/components/charts.md +81 -0
  11. package/AI_USAGE/components/checkbox-api.md +145 -0
  12. package/AI_USAGE/components/checkbox.md +365 -3
  13. package/AI_USAGE/components/color-picker-api.md +52 -0
  14. package/AI_USAGE/components/color-picker.md +211 -3
  15. package/AI_USAGE/components/config-provider-api.md +38 -0
  16. package/AI_USAGE/components/config-provider.md +250 -3
  17. package/AI_USAGE/components/date-picker-api.md +1114 -0
  18. package/AI_USAGE/components/date-picker.md +378 -3
  19. package/AI_USAGE/components/dialog-api.md +142 -0
  20. package/AI_USAGE/components/dialog.md +284 -3
  21. package/AI_USAGE/components/draggable-api.md +146 -0
  22. package/AI_USAGE/components/draggable.md +259 -0
  23. package/AI_USAGE/components/drawer-api.md +78 -0
  24. package/AI_USAGE/components/drawer.md +227 -0
  25. package/AI_USAGE/components/dropdown-api.md +529 -0
  26. package/AI_USAGE/components/dropdown.md +392 -3
  27. package/AI_USAGE/components/empty-api.md +36 -0
  28. package/AI_USAGE/components/empty.md +227 -3
  29. package/AI_USAGE/components/finicon.md +88 -0
  30. package/AI_USAGE/components/form-api.md +524 -0
  31. package/AI_USAGE/components/form.md +454 -0
  32. package/AI_USAGE/components/grid-api.md +527 -0
  33. package/AI_USAGE/components/grid.md +224 -0
  34. package/AI_USAGE/components/heatmap-api.md +122 -0
  35. package/AI_USAGE/components/heatmap.md +220 -0
  36. package/AI_USAGE/components/icon-api.md +4707 -0
  37. package/AI_USAGE/components/icon.md +257 -0
  38. package/AI_USAGE/components/image-api.md +440 -0
  39. package/AI_USAGE/components/image.md +465 -0
  40. package/AI_USAGE/components/input-api.md +184 -0
  41. package/AI_USAGE/components/input-number-api.md +66 -0
  42. package/AI_USAGE/components/input-number.md +294 -0
  43. package/AI_USAGE/components/input-tag-api.md +114 -0
  44. package/AI_USAGE/components/input-tag.md +482 -0
  45. package/AI_USAGE/components/input.md +293 -3
  46. package/AI_USAGE/components/layout-api.md +147 -0
  47. package/AI_USAGE/components/layout.md +230 -0
  48. package/AI_USAGE/components/line-chart-api.md +197 -0
  49. package/AI_USAGE/components/line-chart.md +279 -3
  50. package/AI_USAGE/components/link-api.md +42 -0
  51. package/AI_USAGE/components/link.md +197 -0
  52. package/AI_USAGE/components/menu-api.md +516 -0
  53. package/AI_USAGE/components/menu.md +268 -0
  54. package/AI_USAGE/components/message-api.md +215 -0
  55. package/AI_USAGE/components/message-box-api.md +108 -0
  56. package/AI_USAGE/components/message-box.md +268 -3
  57. package/AI_USAGE/components/message.md +231 -3
  58. package/AI_USAGE/components/network-api.md +91 -0
  59. package/AI_USAGE/components/network.md +378 -0
  60. package/AI_USAGE/components/notification-api.md +236 -0
  61. package/AI_USAGE/components/notification.md +275 -3
  62. package/AI_USAGE/components/pagination-api.md +62 -0
  63. package/AI_USAGE/components/pagination.md +380 -3
  64. package/AI_USAGE/components/pie-chart-api.md +109 -0
  65. package/AI_USAGE/components/pie-chart.md +245 -3
  66. package/AI_USAGE/components/popconfirm-api.md +75 -0
  67. package/AI_USAGE/components/popconfirm.md +231 -3
  68. package/AI_USAGE/components/popover-api.md +75 -0
  69. package/AI_USAGE/components/popover.md +208 -3
  70. package/AI_USAGE/components/popup-api.md +75 -0
  71. package/AI_USAGE/components/popup.md +52 -0
  72. package/AI_USAGE/components/progress-api.md +44 -0
  73. package/AI_USAGE/components/progress.md +248 -3
  74. package/AI_USAGE/components/radio-api.md +165 -0
  75. package/AI_USAGE/components/radio.md +259 -3
  76. package/AI_USAGE/components/rate-api.md +54 -0
  77. package/AI_USAGE/components/rate.md +233 -3
  78. package/AI_USAGE/components/resize-box-api.md +56 -0
  79. package/AI_USAGE/components/resize-box.md +231 -0
  80. package/AI_USAGE/components/scrollbar-api.md +77 -0
  81. package/AI_USAGE/components/scrollbar.md +218 -0
  82. package/AI_USAGE/components/select-api.md +758 -0
  83. package/AI_USAGE/components/select.md +640 -3
  84. package/AI_USAGE/components/skeleton-api.md +85 -0
  85. package/AI_USAGE/components/skeleton.md +150 -0
  86. package/AI_USAGE/components/slider-api.md +51 -0
  87. package/AI_USAGE/components/slider.md +233 -3
  88. package/AI_USAGE/components/space-api.md +38 -0
  89. package/AI_USAGE/components/space.md +145 -0
  90. package/AI_USAGE/components/spin-api.md +43 -0
  91. package/AI_USAGE/components/spin.md +205 -0
  92. package/AI_USAGE/components/steps-api.md +111 -0
  93. package/AI_USAGE/components/steps.md +201 -3
  94. package/AI_USAGE/components/switch-api.md +58 -0
  95. package/AI_USAGE/components/switch.md +290 -3
  96. package/AI_USAGE/components/table-api.md +2919 -0
  97. package/AI_USAGE/components/table.md +1414 -0
  98. package/AI_USAGE/components/tabs-api.md +135 -0
  99. package/AI_USAGE/components/tabs.md +308 -3
  100. package/AI_USAGE/components/tag-api.md +124 -0
  101. package/AI_USAGE/components/tag.md +292 -0
  102. package/AI_USAGE/components/textarea-api.md +55 -0
  103. package/AI_USAGE/components/textarea.md +326 -3
  104. package/AI_USAGE/components/time-picker-api.md +137 -0
  105. package/AI_USAGE/components/time-picker.md +271 -3
  106. package/AI_USAGE/components/time-range-selector-api.md +44 -0
  107. package/AI_USAGE/components/time-range-selector.md +355 -0
  108. package/AI_USAGE/components/timeline-api.md +93 -0
  109. package/AI_USAGE/components/timeline.md +312 -0
  110. package/AI_USAGE/components/tooltip-api.md +77 -0
  111. package/AI_USAGE/components/tooltip.md +182 -0
  112. package/AI_USAGE/components/trend-chart-api.md +119 -0
  113. package/AI_USAGE/components/trend-chart.md +335 -0
  114. package/AI_USAGE/components/trigger-api.md +124 -0
  115. package/AI_USAGE/components/trigger.md +185 -0
  116. package/AI_USAGE/components/upload-api.md +200 -0
  117. package/AI_USAGE/components/upload.md +711 -3
  118. package/AI_USAGE/components/watermark-api.md +87 -0
  119. package/AI_USAGE/components/watermark.md +200 -0
  120. package/AI_USAGE/core.md +1 -1
  121. package/AI_USAGE/index.md +35 -7
  122. package/AI_USAGE/recipes/form-on-demand.md +1 -1
  123. package/AI_USAGE.md +33651 -5
  124. package/CHANGELOG.md +18 -0
  125. package/dist/_utils/inherit-component-type.d.ts +11 -0
  126. package/dist/components/date-picker/index.d.ts +420 -5
  127. package/dist/components/form-input/index.d.ts +617 -2
  128. package/dist/components/layout/index.d.ts +689 -1
  129. package/dist/components/menu/index.d.ts +786 -1
  130. package/dist/es/_utils/inherit-component-type.js +6 -0
  131. package/dist/es/components/date-picker/index.js +18 -17
  132. package/dist/es/components/form-input/index.js +12 -11
  133. package/dist/es/components/layout/index.js +10 -9
  134. package/dist/es/components/menu/hooks/use-level.js +5 -5
  135. package/dist/es/components/menu/index.js +13 -10
  136. package/dist/index.cjs +3 -3
  137. package/dist/index.umd.js +3 -3
  138. package/package.json +10 -5
@@ -0,0 +1,2919 @@
1
+ <!-- Generated by pnpm generate:ai-usage. Edit script/ai-usage/content.md and script/ai-usage/. -->
2
+ # Table 完整公开 API
3
+
4
+ 适用版本:x-next@1.14.0;来源指纹:`014984639d816a2c7e25eb22690c586b0b2e8efba6846bec8a4e424db41a09e9`。
5
+
6
+ 从同版本构建的公开声明、运行时 props/emits 和显式 expose 生成。运行时导入始终使用 `x-next`,声明路径仅作定位。插槽类型未细化时,具体槽名与作用域见本地用法示例。
7
+
8
+ ## Table API
9
+
10
+ 公开声明:`dist/components/table/index.d.ts`。 类型中的 undefined 表示可省略;原始 prop 默认值不等于继承配置或服务默认值。
11
+
12
+ ### Props
13
+
14
+ | 名称 | 用途 | 公开类型 | 必填 | 声明默认值 |
15
+ | --- | --- | --- | --- | --- |
16
+ | columns | 表格列配置 | undefined &#124; TableColumnData[] | 否 | [] |
17
+ | keyboardNavigation | 启用表体单元格方向键、Home / End 导航,保留内嵌控件的键盘行为 | undefined &#124; false &#124; true | 否 | false |
18
+ | data | 表格数据 | undefined &#124; TableData[] | 否 | [] |
19
+ | bordered | 是否显示边框 | undefined &#124; false &#124; true &#124; TableBorder | 否 | false |
20
+ | hoverable | 是否显示行悬浮效果 | undefined &#124; false &#124; true | 否 | true |
21
+ | stripe | 是否显示斑马纹 | undefined &#124; false &#124; true | 否 | false |
22
+ | size | 表格尺寸 | undefined &#124; "mini" &#124; "small" &#124; "medium" &#124; "large" | 否 | undefined |
23
+ | tableLayoutFixed | 是否使用 fixed 表格布局 | undefined &#124; false &#124; true | 否 | false |
24
+ | loading | 是否加载中,默认主题色圆环;object 会透传给 Spin | undefined &#124; false &#124; true &#124; { [x: string]: any; } | 否 | false |
25
+ | rowSelection | 行选择配置 | undefined &#124; TableRowSelection | 否 | 未声明 |
26
+ | expandable | 展开行配置 | undefined &#124; TableExpandable | 否 | 未声明 |
27
+ | scroll | 滚动配置 | undefined &#124; { x?: number &#124; string; y?: number &#124; string; minWidth?: number &#124; string; maxHeight?: number &#124; string; } | 否 | 未声明 |
28
+ | pagination | 分页配置,传 false 可关闭分页 | undefined &#124; false &#124; true &#124; PaginationProps | 否 | true |
29
+ | pagePosition | 分页位置 | undefined &#124; "top" &#124; "bottom" &#124; "tl" &#124; "tr" &#124; "bl" &#124; "br" | 否 | "br" |
30
+ | indentSize | 树形表格缩进距离 | undefined &#124; number | 否 | 16 |
31
+ | rowKey | 表格行 key 字段 | undefined &#124; string | 否 | "key" |
32
+ | showHeader | 是否显示表头 | undefined &#124; false &#124; true | 否 | true |
33
+ | virtualListProps | 虚拟列表配置,传入后开启虚拟滚动 | undefined &#124; VirtualListProps | 否 | 未声明 |
34
+ | spanMethod | 单元格合并方法 | undefined &#124; (data: { record: TableData; column: TableColumnData &#124; TableOperationColumn; rowIndex: number; columnIndex: number; }) => { rowspan?: number; colspan?: number; } &#124; void | 否 | 未声明 |
35
+ | spanAll | 合并方法索引是否包含操作列 | undefined &#124; false &#124; true | 否 | false |
36
+ | components | 自定义内部操作列组织方式 | undefined &#124; TableComponents | 否 | 未声明 |
37
+ | loadMore | 树形数据懒加载函数 | undefined &#124; (record: TableData, done: (children?: TableData[]) => void) => void | 否 | 未声明 |
38
+ | filterIconAlignLeft | 筛选图标是否左对齐 | undefined &#124; false &#124; true | 否 | false |
39
+ | hideExpandButtonOnEmpty | 子树为空时是否隐藏展开按钮 | undefined &#124; false &#124; true | 否 | false |
40
+ | rowClass | 行 class,支持函数 | undefined &#124; string &#124; any[] &#124; { [x: string]: any; } &#124; (record: TableData, rowIndex: number) => any | 否 | 未声明 |
41
+ | draggable | 拖拽排序配置 | undefined &#124; TableDraggable | 否 | 未声明 |
42
+ | columnResizable | 是否允许调整列宽 | undefined &#124; false &#124; true | 否 | false(Vue Boolean 转换) |
43
+ | summary | 是否显示总结行,或自定义总结数据 | undefined &#124; false &#124; true &#124; (params: { columns: TableColumnData[]; data: TableData[]; }) => TableData[] | 否 | false(Vue Boolean 转换) |
44
+ | summaryText | 默认总结行首列文字 | undefined &#124; string | 否 | undefined |
45
+ | summarySpanMethod | 总结行单元格合并方法 | undefined &#124; (data: { record: TableData; column: TableColumnData &#124; TableOperationColumn; rowIndex: number; columnIndex: number; }) => { rowspan?: number; colspan?: number; } &#124; void | 否 | 未声明 |
46
+ | selectedKeys | 已选择行 key,受控模式 | undefined &#124; (string &#124; number)[] | 否 | 未声明 |
47
+ | defaultSelectedKeys | 默认已选择行 key | undefined &#124; (string &#124; number)[] | 否 | 未声明 |
48
+ | expandedKeys | 已展开行 key,受控模式 | undefined &#124; (string &#124; number)[] | 否 | 未声明 |
49
+ | defaultExpandedKeys | 默认展开行 key | undefined &#124; (string &#124; number)[] | 否 | 未声明 |
50
+ | defaultExpandAllRows | 是否默认展开全部行 | undefined &#124; false &#124; true | 否 | false |
51
+ | stickyHeader | 是否开启表头吸顶,数字表示 top 偏移 | undefined &#124; number &#124; false &#124; true | 否 | false |
52
+ | scrollbar | 是否使用自定义滚动条,或传入 Scrollbar 配置 | undefined &#124; false &#124; true &#124; ScrollbarProps | 否 | true |
53
+ | showEmptyTree | 是否展示空子树 | undefined &#124; false &#124; true | 否 | false |
54
+
55
+ ### Events
56
+
57
+ | 事件 | 用途 | 监听器签名(即事件参数) |
58
+ | --- | --- | --- |
59
+ | update:selectedKeys | 选中行变化时触发 | undefined &#124; (rowKeys: (string &#124; number)[]) => any |
60
+ | update:expandedKeys | 展开行变化时触发 | undefined &#124; (rowKeys: (string &#124; number)[]) => any |
61
+ | expand | 点击展开行时触发 | undefined &#124; (rowKey: string &#124; number, record: TableData) => any |
62
+ | expandedChange | 展开行变化时触发 | undefined &#124; (rowKeys: (string &#124; number)[]) => any |
63
+ | select | 点击行选择器时触发 | undefined &#124; (rowKeys: (string &#124; number)[], rowKey: string &#124; number, record: TableData) => any |
64
+ | selectAll | 点击全选选择器时触发 | undefined &#124; (checked: boolean) => any |
65
+ | selectionChange | 已选择行变化时触发 | undefined &#124; (rowKeys: (string &#124; number)[]) => any |
66
+ | sorterChange | 排序规则变化时触发 | undefined &#124; (dataIndex: string, direction: string) => any |
67
+ | filterChange | 筛选项变化时触发 | undefined &#124; (dataIndex: string, filteredValues: string[]) => any |
68
+ | pageChange | 分页页码变化时触发 | undefined &#124; (page: number) => any |
69
+ | pageSizeChange | 每页数量变化时触发 | undefined &#124; (pageSize: number) => any |
70
+ | change | 分页、排序、筛选、拖拽变化时触发 | undefined &#124; (data: TableData[], extra: TableChangeExtra, currentData: TableData[]) => any |
71
+ | cellMouseEnter | 鼠标进入单元格时触发 | undefined &#124; (record: TableData, column: TableColumnData, ev: Event) => any |
72
+ | cellMouseLeave | 鼠标离开单元格时触发 | undefined &#124; (record: TableData, column: TableColumnData, ev: Event) => any |
73
+ | cellClick | 点击单元格时触发 | undefined &#124; (record: TableData, column: TableColumnData, ev: Event) => any |
74
+ | rowClick | 点击行时触发 | undefined &#124; (record: TableData, ev: Event) => any |
75
+ | headerClick | 点击表头时触发 | undefined &#124; (column: TableColumnData, ev: Event) => any |
76
+ | columnResize | 调整列宽时触发 | undefined &#124; (dataIndex: string, width: number) => any |
77
+ | rowDblclick | 双击行时触发 | undefined &#124; (record: TableData, ev: Event) => any |
78
+ | cellDblclick | 双击单元格时触发 | undefined &#124; (record: TableData, column: TableColumnData, ev: Event) => any |
79
+ | rowContextmenu | 右击行时触发 | undefined &#124; (record: TableData, ev: Event) => any |
80
+ | cellContextmenu | 右击单元格时触发 | undefined &#124; (record: TableData, column: TableColumnData, ev: Event) => any |
81
+
82
+ ### Slots
83
+
84
+ | 名称 | 用途 | 公开类型 |
85
+ | --- | --- | --- |
86
+ | default | TableColumn 声明式列,或自定义 table 内容 | 文档列出的实际插槽;公开类型未细化,作用域见场景用法 |
87
+ | columns | TableColumn 声明式列 | 文档列出的实际插槽;公开类型未细化,作用域见场景用法 |
88
+ | expand-icon | 自定义展开图标 | 文档列出的实际插槽;公开类型未细化,作用域见场景用法 |
89
+ | expand-row | 展开行内容 | 文档列出的实际插槽;公开类型未细化,作用域见场景用法 |
90
+ | footer | 表格底部内容 | 文档列出的实际插槽;公开类型未细化,作用域见场景用法 |
91
+ | drag-handle-icon | 拖拽手柄图标 | 文档列出的实际插槽;公开类型未细化,作用域见场景用法 |
92
+ | tbody | 自定义 tbody 元素 | 文档列出的实际插槽;公开类型未细化,作用域见场景用法 |
93
+ | tr | 自定义 tr 元素 | 文档列出的实际插槽;公开类型未细化,作用域见场景用法 |
94
+ | td | 自定义 td 元素 | 文档列出的实际插槽;公开类型未细化,作用域见场景用法 |
95
+ | pagination-left | 分页器左侧内容 | 文档列出的实际插槽;公开类型未细化,作用域见场景用法 |
96
+ | pagination-right | 分页器右侧内容 | 文档列出的实际插槽;公开类型未细化,作用域见场景用法 |
97
+ | summary-cell | 总结行单元格 | 文档列出的实际插槽;公开类型未细化,作用域见场景用法 |
98
+ | empty | 空态内容 | 文档列出的实际插槽;公开类型未细化,作用域见场景用法 |
99
+ | thead | 自定义 thead 元素 | 文档列出的实际插槽;公开类型未细化,作用域见场景用法 |
100
+ | th | 自定义 th 元素 | 文档列出的实际插槽;公开类型未细化,作用域见场景用法 |
101
+
102
+ ### 实例方法 / 暴露值
103
+
104
+ | 名称 | 公开类型 |
105
+ | --- | --- |
106
+ | selectAll | (checked?: boolean) => void |
107
+ | select | (rowKey: string &#124; number &#124; (string &#124; number)[], checked?: boolean) => void |
108
+ | expandAll | (checked?: boolean) => void |
109
+ | expand | (rowKey: string &#124; number &#124; (string &#124; number)[], checked?: boolean) => void |
110
+ | resetFilters | (dataIndex?: string &#124; string[]) => void |
111
+ | clearFilters | (dataIndex?: string &#124; string[]) => void |
112
+ | resetSorters | () => void |
113
+ | clearSorters | () => void |
114
+
115
+ ### 关联类型定义
116
+
117
+ 以下摘自本组件族声明,供查阅嵌套配置;运行时和值类型均以根入口可导出项为准。
118
+
119
+ ```typescript-reference
120
+ declare const TABLE_PAGE_POSITION: readonly ["tl", "top", "tr", "bl", "bottom", "br"];
121
+
122
+ type TablePagePosition = (typeof TABLE_PAGE_POSITION)[number];
123
+
124
+ interface TableData {
125
+ /**
126
+ * @zh 数据行的key
127
+ * @en The key of the data row
128
+ */
129
+ key?: string | number;
130
+ /**
131
+ * @zh 扩展行内容
132
+ * @en Expand row content
133
+ */
134
+ expand?: string | RenderFunction;
135
+ /**
136
+ * @zh 子数据
137
+ * @en Sub data
138
+ */
139
+ children?: TableData[];
140
+ /**
141
+ * @zh 是否禁用行选择器
142
+ * @en Whether to disable the row selector
143
+ */
144
+ disabled?: boolean;
145
+ /**
146
+ * @zh 是否是叶子节点
147
+ * @en Whether it is a leaf node
148
+ * @version 2.13.0
149
+ */
150
+ isLeaf?: boolean;
151
+ [name: string]: any;
152
+ }
153
+
154
+ interface TableDataWithRaw {
155
+ raw: TableData;
156
+ key: string | number;
157
+ disabled?: boolean;
158
+ expand?: string | RenderFunction;
159
+ children?: TableDataWithRaw[];
160
+ isLeaf?: boolean;
161
+ hasSubtree?: boolean;
162
+ }
163
+
164
+ interface TableSortable {
165
+ /**
166
+ * @zh 支持的排序方向
167
+ * @en Supported sort direction
168
+ */
169
+ sortDirections: ('ascend' | 'descend')[];
170
+ /**
171
+ * @zh 排序函数。设置为 `true` 可关闭内部排序。2.19.0 版本修改传出数据。
172
+ * @en Sorting function. Set to `true` to turn off internal sorting. Version 2.19.0 modifies outgoing data.
173
+ */
174
+ sorter?: ((a: TableData, b: TableData, extra: {
175
+ dataIndex: string;
176
+ direction: 'ascend' | 'descend';
177
+ }) => number) | boolean;
178
+ /**
179
+ * @zh 排序方向
180
+ * @en Sort direction
181
+ */
182
+ sortOrder?: 'ascend' | 'descend' | '';
183
+ /**
184
+ * @zh 默认排序方向(非受控模式)
185
+ * @en Default sort direction (uncontrolled mode)
186
+ */
187
+ defaultSortOrder?: 'ascend' | 'descend' | '';
188
+ /**
189
+ * @zh 多列排序优先级,数字越大越先比较;只在声明优先级的列之间保留多列排序。
190
+ * @en Multi-column sort priority. Higher values are compared first.
191
+ */
192
+ sortPriority?: number;
193
+ }
194
+
195
+ interface TableFilterData {
196
+ /**
197
+ * @zh 筛选数据选项的内容
198
+ * @en Filter the content of the data option
199
+ */
200
+ text: string | RenderFunction;
201
+ /**
202
+ * @zh 筛选数据选项的值
203
+ * @en Filter the value of the data option
204
+ */
205
+ value: string;
206
+ }
207
+
208
+ interface TableFilterable {
209
+ /**
210
+ * @zh 筛选数据
211
+ * @en Filter data
212
+ */
213
+ filters?: TableFilterData[];
214
+ /**
215
+ * @zh 筛选函数
216
+ * @en Filter function
217
+ */
218
+ filter: (filteredValue: string[], record: TableData) => boolean;
219
+ /**
220
+ * @zh 是否支持多选
221
+ * @en Whether to support multiple selection
222
+ */
223
+ multiple?: boolean;
224
+ /**
225
+ * @zh 筛选项
226
+ * @en Filter value
227
+ */
228
+ filteredValue?: string[];
229
+ /**
230
+ * @zh 默认筛选项
231
+ * @en Default filter value
232
+ */
233
+ defaultFilteredValue?: string[];
234
+ /**
235
+ * @zh 筛选框的内容
236
+ * @en The content of filter box
237
+ */
238
+ renderContent?: (data: {
239
+ filterValue: string[];
240
+ setFilterValue: (filterValue: string[]) => void;
241
+ handleFilterConfirm: (event: Event) => void;
242
+ handleFilterReset: (event: Event) => void;
243
+ }) => VNodeChild;
244
+ /**
245
+ * @zh 筛选按钮的图标
246
+ * @en Filter icon for button
247
+ */
248
+ icon?: RenderFunction;
249
+ /**
250
+ * @zh 筛选框的弹出框配置
251
+ * @en Pop-up box configuration of filter box
252
+ */
253
+ triggerProps?: TriggerProps;
254
+ /**
255
+ * @zh 筛选图标是否左对齐
256
+ * @en Whether the filter icon is aligned to the left
257
+ * @version 2.13.0
258
+ */
259
+ alignLeft?: boolean;
260
+ slotName?: string;
261
+ }
262
+
263
+ interface TableColumnData {
264
+ /**
265
+ * @zh 列信息的标识,对应 `TableData` 中的数据
266
+ * @en The identifier of the column information, corresponding to the data in `TableData`
267
+ */
268
+ dataIndex?: string;
269
+ /**
270
+ * @zh 列标题
271
+ * @en Column header
272
+ */
273
+ title?: string | RenderFunction;
274
+ /**
275
+ * @zh 列宽度
276
+ * @en Column width
277
+ */
278
+ width?: number;
279
+ /**
280
+ * @zh 最小列宽
281
+ * @en Minimum column width
282
+ */
283
+ minWidth?: number;
284
+ /**
285
+ * @zh 对齐方向
286
+ * @en Alignment direction
287
+ */
288
+ align?: 'left' | 'center' | 'right';
289
+ /**
290
+ * @zh 固定位置
291
+ * @en Fixed position
292
+ */
293
+ fixed?: 'left' | 'right';
294
+ /**
295
+ * @zh 是否显示省略号
296
+ * @en Whether to show ellipsis
297
+ */
298
+ ellipsis?: boolean;
299
+ /**
300
+ * @zh 是否在显示省略号时显示文本提示。可填入 tooltip 组件属性
301
+ * @en Whether to show a text hint when an ellipsis is displayed. Can be filled in tooltip component properties
302
+ * @version 2.26.0
303
+ */
304
+ tooltip?: boolean | Record<string, any>;
305
+ /**
306
+ * @zh 排序相关选项
307
+ * @en Sorting related options
308
+ */
309
+ sortable?: TableSortable;
310
+ /**
311
+ * @zh 过滤相关选项
312
+ * @en Filter related options
313
+ */
314
+ filterable?: TableFilterable;
315
+ /**
316
+ * @zh 表头子数据,用于表头分组
317
+ * @en Header sub-data, used for header grouping
318
+ */
319
+ children?: TableColumnData[];
320
+ /**
321
+ * @zh 自定义单元格类名
322
+ * @en Custom cell class
323
+ * @version 2.36.0
324
+ */
325
+ cellClass?: ClassName;
326
+ /**
327
+ * @zh 自定义表头单元格类名
328
+ * @en Custom header cell class
329
+ * @version 2.36.0
330
+ */
331
+ headerCellClass?: ClassName;
332
+ /**
333
+ * @zh 自定义内容单元格类名
334
+ * @en Custom body cell class
335
+ * @version 2.36.0
336
+ */
337
+ bodyCellClass?: ClassName | ((record: TableData) => ClassName);
338
+ /**
339
+ * @zh 自定义总结栏单元格类名
340
+ * @en Custom body cell class
341
+ * @version 2.36.0
342
+ */
343
+ summaryCellClass?: ClassName | ((record: TableData) => ClassName);
344
+ /**
345
+ * @zh 自定义单元格样式
346
+ * @en Custom cell style
347
+ * @version 2.11.0
348
+ */
349
+ cellStyle?: CSSProperties;
350
+ /**
351
+ * @zh 自定义表头单元格样式
352
+ * @en Custom header cell style
353
+ * @version 2.29.0
354
+ */
355
+ headerCellStyle?: CSSProperties;
356
+ /**
357
+ * @zh 自定义内容单元格样式
358
+ * @en Custom body cell style
359
+ * @version 2.29.0
360
+ */
361
+ bodyCellStyle?: CSSProperties | ((record: TableData) => CSSProperties);
362
+ /**
363
+ * @zh 自定义总结栏单元格样式
364
+ * @en Custom summary cell style
365
+ * @version 2.30.0
366
+ */
367
+ summaryCellStyle?: CSSProperties | ((record: TableData) => CSSProperties);
368
+ /**
369
+ * @zh 自定义列单元格的渲染
370
+ * @en Customize the rendering of column cells
371
+ */
372
+ render?: (data: {
373
+ record: TableData;
374
+ column: TableColumnData;
375
+ rowIndex: number;
376
+ }) => VNodeChild;
377
+ /**
378
+ * @zh 设置当前列的渲染插槽的名字。插槽参数同 #cell
379
+ * @en Sets the name of the render slot for the current column. Slot parameters are the same as #cell
380
+ * @version 2.18.0
381
+ */
382
+ slotName?: string;
383
+ /**
384
+ * @zh 设置当前列的标题的渲染插槽的名字
385
+ * @en Set the name of the render slot for the header of the current column
386
+ * @version 2.23.0
387
+ */
388
+ titleSlotName?: string;
389
+ slots?: Slots;
390
+ isLastLeftFixed?: boolean;
391
+ isFirstRightFixed?: boolean;
392
+ colSpan?: number;
393
+ rowSpan?: number;
394
+ index?: number;
395
+ parent?: TableColumnData;
396
+ _resizeWidth?: number;
397
+ }
398
+
399
+ interface TableBorder {
400
+ /**
401
+ * @zh 是否展示外边框
402
+ * @en TWhether to display the outer border
403
+ */
404
+ wrapper?: boolean;
405
+ /**
406
+ * @zh 是否展示单元格边框(表头+主体)
407
+ * @en Whether to display the cell border (header + body)
408
+ */
409
+ cell?: boolean;
410
+ /**
411
+ * @zh 是否展示表头单元格边框
412
+ * @en Whether to display the header cell border
413
+ */
414
+ headerCell?: boolean;
415
+ /**
416
+ * @zh 是否展示主体单元格边框
417
+ * @en Whether to display the body cell border
418
+ */
419
+ bodyCell?: boolean;
420
+ }
421
+
422
+ interface TableRowSelection {
423
+ /**
424
+ * @zh 行选择器的类型
425
+ * @en The type of row selector
426
+ */
427
+ type?: 'checkbox' | 'radio';
428
+ /**
429
+ * @zh 已选择的行(受控模式)
430
+ * @en Selected row (controlled mode)
431
+ */
432
+ selectedRowKeys?: BaseType[];
433
+ /**
434
+ * @zh 默认已选择的行(非受控模式)
435
+ * @en The selected row by default (uncontrolled mode)
436
+ */
437
+ defaultSelectedRowKeys?: BaseType[];
438
+ /**
439
+ * @zh 是否显示全选选择器
440
+ * @en Whether to show the select all selector
441
+ */
442
+ showCheckedAll?: boolean;
443
+ /**
444
+ * @zh 列标题
445
+ * @en Column title
446
+ */
447
+ title?: string;
448
+ /**
449
+ * @zh 列宽度
450
+ * @en Column width
451
+ */
452
+ width?: number;
453
+ /**
454
+ * @zh 是否固定
455
+ * @en Is it fixed
456
+ */
457
+ fixed?: boolean;
458
+ /**
459
+ * @zh 是否开启严格选择模式
460
+ * @en Whether to enable strict selection mode
461
+ * @defaultValue true
462
+ * @version 2.29.0
463
+ */
464
+ checkStrictly?: boolean;
465
+ /**
466
+ * @zh 是否仅展示当前页的 keys(切换分页时清空 keys)
467
+ * @en Whether to display only the keys of the current page (clear keys when switching paging)
468
+ * @version 2.32.0
469
+ */
470
+ onlyCurrent?: boolean;
471
+ }
472
+
473
+ interface TableExpandable {
474
+ /**
475
+ * @zh 显示的展开行(受控模式)
476
+ * @en Displayed Expanded Row (Controlled Mode)
477
+ */
478
+ expandedRowKeys?: BaseType[];
479
+ /**
480
+ * @zh 默认显示的展开行(非受控模式)
481
+ * @en Expand row displayed by default (Uncontrolled mode)
482
+ */
483
+ defaultExpandedRowKeys?: BaseType[];
484
+ /**
485
+ * @zh 是否默认展开所有的行
486
+ * @en Whether to expand all rows by default
487
+ */
488
+ defaultExpandAllRows?: boolean;
489
+ /**
490
+ * @zh 自定义展开行内容
491
+ * @en Customize expanded row content
492
+ */
493
+ expandedRowRender?: (record: TableData) => VNodeChild;
494
+ /**
495
+ * @zh 展开图标
496
+ * @en Expand icon
497
+ */
498
+ icon?: (expanded: boolean, record: TableData) => VNodeChild;
499
+ /**
500
+ * @zh 列标题
501
+ * @en Column title
502
+ */
503
+ title?: string;
504
+ /**
505
+ * @zh 列宽度
506
+ * @en Column width
507
+ */
508
+ width?: number;
509
+ /**
510
+ * @zh 是否固定
511
+ * @en Is it fixed
512
+ */
513
+ fixed?: boolean;
514
+ }
515
+
516
+ interface TableDraggable {
517
+ /**
518
+ * @zh 拖拽类型
519
+ * @en drag type
520
+ */
521
+ type?: 'row' | 'handle';
522
+ /**
523
+ * @zh 列标题
524
+ * @en Column title
525
+ */
526
+ title?: string;
527
+ /**
528
+ * @zh 列宽度
529
+ * @en Column width
530
+ */
531
+ width?: number;
532
+ /**
533
+ * @zh 是否固定
534
+ * @en Is it fixed
535
+ */
536
+ fixed?: boolean;
537
+ }
538
+
539
+ type OperationName = 'selection-checkbox' | 'selection-radio' | 'expand' | 'drag-handle';
540
+
541
+ interface TableOperationColumn {
542
+ name: OperationName | string;
543
+ title?: string | RenderFunction;
544
+ width?: number;
545
+ fixed?: boolean;
546
+ render?: (record: TableData) => VNodeChild;
547
+ isLastLeftFixed?: boolean;
548
+ }
549
+
550
+ interface TableComponents {
551
+ operations: (operations: {
552
+ dragHandle?: TableOperationColumn;
553
+ expand?: TableOperationColumn;
554
+ selection?: TableOperationColumn;
555
+ }) => TableOperationColumn[];
556
+ }
557
+
558
+ interface TableChangeExtra {
559
+ /**
560
+ * @zh 触发类型
561
+ * @en Trigger type
562
+ */
563
+ type: 'pagination' | 'sorter' | 'filter' | 'drag';
564
+ /**
565
+ * @zh 页码
566
+ * @en page number
567
+ */
568
+ page?: number;
569
+ /**
570
+ * @zh 每页数据数
571
+ * @en number per page
572
+ */
573
+ pageSize?: number;
574
+ /**
575
+ * @zh 排序信息
576
+ * @en Sort information
577
+ */
578
+ sorter?: Sorter;
579
+ /** 按优先级排列的全部排序条件;sorter 保留首个条件以兼容已有消费方。 */
580
+ sorters?: Sorter[];
581
+ /**
582
+ * @zh 筛选信息
583
+ * @en Filter information
584
+ */
585
+ filters?: Filters;
586
+ /**
587
+ * @zh 拖拽信息
588
+ * @en Drag and drop information
589
+ */
590
+ dragTarget?: TableData;
591
+ }
592
+
593
+ interface TableInternalProps {
594
+ columns: TableColumnData[];
595
+ data: TableData[];
596
+ bordered?: boolean | TableBorder;
597
+ rowSelection?: TableRowSelection;
598
+ expandable?: TableExpandable;
599
+ pagination?: boolean | Data;
600
+ pagePosition?: string;
601
+ }
602
+
603
+ type Sorter = {
604
+ field: string;
605
+ direction: 'ascend' | 'descend';
606
+ };
607
+
608
+ type Filters = Record<string, string[]>;
609
+
610
+ declare const TD_TYPES: readonly ["normal", "operation", "checkbox", "radio", "expand"];
611
+
612
+ type TdTypes = (typeof TD_TYPES)[number];
613
+
614
+ type TableInstance = InstanceType<typeof _Table>;
615
+
616
+ type TableProps = InstanceType<typeof _Table>['$props'];
617
+
618
+ type TheadInstance = InstanceType<typeof _Thead>;
619
+
620
+ type TbodyInstance = InstanceType<typeof _Tbody>;
621
+
622
+ type TrInstance = InstanceType<typeof _Tr>;
623
+
624
+ type ThInstance = InstanceType<typeof _Th>;
625
+
626
+ type TdInstance = InstanceType<typeof _Td>;
627
+
628
+ type TableColumnInstance = InstanceType<typeof _TableColumn>;
629
+ ```
630
+
631
+
632
+ ## TableColumn API
633
+
634
+ 公开声明:`dist/components/table/index.d.ts`。 类型中的 undefined 表示可省略;原始 prop 默认值不等于继承配置或服务默认值。
635
+
636
+ ### Props
637
+
638
+ | 名称 | 用途 | 公开类型 | 必填 | 声明默认值 |
639
+ | --- | --- | --- | --- | --- |
640
+ | dataIndex | 列字段名 | undefined &#124; string | 否 | 未声明 |
641
+ | title | 列标题 | undefined &#124; string | 否 | 未声明 |
642
+ | width | 列宽 | undefined &#124; number | 否 | 未声明 |
643
+ | minWidth | 最小列宽 | undefined &#124; number | 否 | 未声明 |
644
+ | align | 对齐方式 | undefined &#124; "center" &#124; "right" &#124; "left" | 否 | 未声明 |
645
+ | fixed | 固定位置 | undefined &#124; "right" &#124; "left" | 否 | 未声明 |
646
+ | ellipsis | 是否显示省略 | undefined &#124; false &#124; true | 否 | false |
647
+ | sortable | 排序配置 | undefined &#124; TableSortable | 否 | undefined |
648
+ | filterable | 筛选配置 | undefined &#124; TableFilterable | 否 | undefined |
649
+ | cellClass | 单元格 class | undefined &#124; string &#124; { [x: string]: boolean; } &#124; (string &#124; Record<string, boolean>)[] | 否 | 未声明 |
650
+ | headerCellClass | 表头单元格 class | undefined &#124; string &#124; { [x: string]: boolean; } &#124; (string &#124; Record<string, boolean>)[] | 否 | 未声明 |
651
+ | bodyCellClass | 内容单元格 class | undefined &#124; string &#124; { [x: string]: boolean; } &#124; (string &#124; Record<string, boolean>)[] &#124; (record: TableData) => ClassName | 否 | 未声明 |
652
+ | summaryCellClass | 总结单元格 class | undefined &#124; string &#124; { [x: string]: boolean; } &#124; (string &#124; Record<string, boolean>)[] &#124; (record: TableData) => ClassName | 否 | 未声明 |
653
+ | cellStyle | 单元格样式 | undefined &#124; CSSProperties | 否 | 未声明 |
654
+ | headerCellStyle | 表头单元格样式 | undefined &#124; CSSProperties | 否 | 未声明 |
655
+ | bodyCellStyle | 内容单元格样式 | undefined &#124; CSSProperties &#124; (record: TableData) => CSSProperties | 否 | 未声明 |
656
+ | summaryCellStyle | 总结单元格样式 | undefined &#124; CSSProperties &#124; (record: TableData) => CSSProperties | 否 | 未声明 |
657
+ | index | 手动指定列序号,通常无需使用 | undefined &#124; number | 否 | 未声明 |
658
+ | tooltip | 省略时是否显示提示,或 Tooltip 配置 | undefined &#124; false &#124; true &#124; { [x: string]: any; } | 否 | false |
659
+
660
+ ### Events
661
+
662
+ 未声明组件 emits;原生事件与包装透传按本页用法核实。
663
+
664
+ ### Slots
665
+
666
+ | 名称 | 用途 | 公开类型 |
667
+ | --- | --- | --- |
668
+ | cell | 单元格内容 | 文档列出的实际插槽;公开类型未细化,作用域见场景用法 |
669
+ | title | 表头内容 | 文档列出的实际插槽;公开类型未细化,作用域见场景用法 |
670
+ | filter-content | 自定义筛选弹层内容 | 文档列出的实际插槽;公开类型未细化,作用域见场景用法 |
671
+ | filter-icon | 自定义筛选图标 | 文档列出的实际插槽;公开类型未细化,作用域见场景用法 |
672
+
673
+ ### 实例方法
674
+
675
+ 没有检索到显式 expose 或 Options API methods 的公开方法;不把 setup 内部函数当成稳定实例 API。
676
+
677
+ ### 关联类型定义
678
+
679
+ 以下摘自本组件族声明,供查阅嵌套配置;运行时和值类型均以根入口可导出项为准。
680
+
681
+ ```typescript-reference
682
+ declare const TABLE_PAGE_POSITION: readonly ["tl", "top", "tr", "bl", "bottom", "br"];
683
+
684
+ type TablePagePosition = (typeof TABLE_PAGE_POSITION)[number];
685
+
686
+ interface TableData {
687
+ /**
688
+ * @zh 数据行的key
689
+ * @en The key of the data row
690
+ */
691
+ key?: string | number;
692
+ /**
693
+ * @zh 扩展行内容
694
+ * @en Expand row content
695
+ */
696
+ expand?: string | RenderFunction;
697
+ /**
698
+ * @zh 子数据
699
+ * @en Sub data
700
+ */
701
+ children?: TableData[];
702
+ /**
703
+ * @zh 是否禁用行选择器
704
+ * @en Whether to disable the row selector
705
+ */
706
+ disabled?: boolean;
707
+ /**
708
+ * @zh 是否是叶子节点
709
+ * @en Whether it is a leaf node
710
+ * @version 2.13.0
711
+ */
712
+ isLeaf?: boolean;
713
+ [name: string]: any;
714
+ }
715
+
716
+ interface TableDataWithRaw {
717
+ raw: TableData;
718
+ key: string | number;
719
+ disabled?: boolean;
720
+ expand?: string | RenderFunction;
721
+ children?: TableDataWithRaw[];
722
+ isLeaf?: boolean;
723
+ hasSubtree?: boolean;
724
+ }
725
+
726
+ interface TableSortable {
727
+ /**
728
+ * @zh 支持的排序方向
729
+ * @en Supported sort direction
730
+ */
731
+ sortDirections: ('ascend' | 'descend')[];
732
+ /**
733
+ * @zh 排序函数。设置为 `true` 可关闭内部排序。2.19.0 版本修改传出数据。
734
+ * @en Sorting function. Set to `true` to turn off internal sorting. Version 2.19.0 modifies outgoing data.
735
+ */
736
+ sorter?: ((a: TableData, b: TableData, extra: {
737
+ dataIndex: string;
738
+ direction: 'ascend' | 'descend';
739
+ }) => number) | boolean;
740
+ /**
741
+ * @zh 排序方向
742
+ * @en Sort direction
743
+ */
744
+ sortOrder?: 'ascend' | 'descend' | '';
745
+ /**
746
+ * @zh 默认排序方向(非受控模式)
747
+ * @en Default sort direction (uncontrolled mode)
748
+ */
749
+ defaultSortOrder?: 'ascend' | 'descend' | '';
750
+ /**
751
+ * @zh 多列排序优先级,数字越大越先比较;只在声明优先级的列之间保留多列排序。
752
+ * @en Multi-column sort priority. Higher values are compared first.
753
+ */
754
+ sortPriority?: number;
755
+ }
756
+
757
+ interface TableFilterData {
758
+ /**
759
+ * @zh 筛选数据选项的内容
760
+ * @en Filter the content of the data option
761
+ */
762
+ text: string | RenderFunction;
763
+ /**
764
+ * @zh 筛选数据选项的值
765
+ * @en Filter the value of the data option
766
+ */
767
+ value: string;
768
+ }
769
+
770
+ interface TableFilterable {
771
+ /**
772
+ * @zh 筛选数据
773
+ * @en Filter data
774
+ */
775
+ filters?: TableFilterData[];
776
+ /**
777
+ * @zh 筛选函数
778
+ * @en Filter function
779
+ */
780
+ filter: (filteredValue: string[], record: TableData) => boolean;
781
+ /**
782
+ * @zh 是否支持多选
783
+ * @en Whether to support multiple selection
784
+ */
785
+ multiple?: boolean;
786
+ /**
787
+ * @zh 筛选项
788
+ * @en Filter value
789
+ */
790
+ filteredValue?: string[];
791
+ /**
792
+ * @zh 默认筛选项
793
+ * @en Default filter value
794
+ */
795
+ defaultFilteredValue?: string[];
796
+ /**
797
+ * @zh 筛选框的内容
798
+ * @en The content of filter box
799
+ */
800
+ renderContent?: (data: {
801
+ filterValue: string[];
802
+ setFilterValue: (filterValue: string[]) => void;
803
+ handleFilterConfirm: (event: Event) => void;
804
+ handleFilterReset: (event: Event) => void;
805
+ }) => VNodeChild;
806
+ /**
807
+ * @zh 筛选按钮的图标
808
+ * @en Filter icon for button
809
+ */
810
+ icon?: RenderFunction;
811
+ /**
812
+ * @zh 筛选框的弹出框配置
813
+ * @en Pop-up box configuration of filter box
814
+ */
815
+ triggerProps?: TriggerProps;
816
+ /**
817
+ * @zh 筛选图标是否左对齐
818
+ * @en Whether the filter icon is aligned to the left
819
+ * @version 2.13.0
820
+ */
821
+ alignLeft?: boolean;
822
+ slotName?: string;
823
+ }
824
+
825
+ interface TableColumnData {
826
+ /**
827
+ * @zh 列信息的标识,对应 `TableData` 中的数据
828
+ * @en The identifier of the column information, corresponding to the data in `TableData`
829
+ */
830
+ dataIndex?: string;
831
+ /**
832
+ * @zh 列标题
833
+ * @en Column header
834
+ */
835
+ title?: string | RenderFunction;
836
+ /**
837
+ * @zh 列宽度
838
+ * @en Column width
839
+ */
840
+ width?: number;
841
+ /**
842
+ * @zh 最小列宽
843
+ * @en Minimum column width
844
+ */
845
+ minWidth?: number;
846
+ /**
847
+ * @zh 对齐方向
848
+ * @en Alignment direction
849
+ */
850
+ align?: 'left' | 'center' | 'right';
851
+ /**
852
+ * @zh 固定位置
853
+ * @en Fixed position
854
+ */
855
+ fixed?: 'left' | 'right';
856
+ /**
857
+ * @zh 是否显示省略号
858
+ * @en Whether to show ellipsis
859
+ */
860
+ ellipsis?: boolean;
861
+ /**
862
+ * @zh 是否在显示省略号时显示文本提示。可填入 tooltip 组件属性
863
+ * @en Whether to show a text hint when an ellipsis is displayed. Can be filled in tooltip component properties
864
+ * @version 2.26.0
865
+ */
866
+ tooltip?: boolean | Record<string, any>;
867
+ /**
868
+ * @zh 排序相关选项
869
+ * @en Sorting related options
870
+ */
871
+ sortable?: TableSortable;
872
+ /**
873
+ * @zh 过滤相关选项
874
+ * @en Filter related options
875
+ */
876
+ filterable?: TableFilterable;
877
+ /**
878
+ * @zh 表头子数据,用于表头分组
879
+ * @en Header sub-data, used for header grouping
880
+ */
881
+ children?: TableColumnData[];
882
+ /**
883
+ * @zh 自定义单元格类名
884
+ * @en Custom cell class
885
+ * @version 2.36.0
886
+ */
887
+ cellClass?: ClassName;
888
+ /**
889
+ * @zh 自定义表头单元格类名
890
+ * @en Custom header cell class
891
+ * @version 2.36.0
892
+ */
893
+ headerCellClass?: ClassName;
894
+ /**
895
+ * @zh 自定义内容单元格类名
896
+ * @en Custom body cell class
897
+ * @version 2.36.0
898
+ */
899
+ bodyCellClass?: ClassName | ((record: TableData) => ClassName);
900
+ /**
901
+ * @zh 自定义总结栏单元格类名
902
+ * @en Custom body cell class
903
+ * @version 2.36.0
904
+ */
905
+ summaryCellClass?: ClassName | ((record: TableData) => ClassName);
906
+ /**
907
+ * @zh 自定义单元格样式
908
+ * @en Custom cell style
909
+ * @version 2.11.0
910
+ */
911
+ cellStyle?: CSSProperties;
912
+ /**
913
+ * @zh 自定义表头单元格样式
914
+ * @en Custom header cell style
915
+ * @version 2.29.0
916
+ */
917
+ headerCellStyle?: CSSProperties;
918
+ /**
919
+ * @zh 自定义内容单元格样式
920
+ * @en Custom body cell style
921
+ * @version 2.29.0
922
+ */
923
+ bodyCellStyle?: CSSProperties | ((record: TableData) => CSSProperties);
924
+ /**
925
+ * @zh 自定义总结栏单元格样式
926
+ * @en Custom summary cell style
927
+ * @version 2.30.0
928
+ */
929
+ summaryCellStyle?: CSSProperties | ((record: TableData) => CSSProperties);
930
+ /**
931
+ * @zh 自定义列单元格的渲染
932
+ * @en Customize the rendering of column cells
933
+ */
934
+ render?: (data: {
935
+ record: TableData;
936
+ column: TableColumnData;
937
+ rowIndex: number;
938
+ }) => VNodeChild;
939
+ /**
940
+ * @zh 设置当前列的渲染插槽的名字。插槽参数同 #cell
941
+ * @en Sets the name of the render slot for the current column. Slot parameters are the same as #cell
942
+ * @version 2.18.0
943
+ */
944
+ slotName?: string;
945
+ /**
946
+ * @zh 设置当前列的标题的渲染插槽的名字
947
+ * @en Set the name of the render slot for the header of the current column
948
+ * @version 2.23.0
949
+ */
950
+ titleSlotName?: string;
951
+ slots?: Slots;
952
+ isLastLeftFixed?: boolean;
953
+ isFirstRightFixed?: boolean;
954
+ colSpan?: number;
955
+ rowSpan?: number;
956
+ index?: number;
957
+ parent?: TableColumnData;
958
+ _resizeWidth?: number;
959
+ }
960
+
961
+ interface TableBorder {
962
+ /**
963
+ * @zh 是否展示外边框
964
+ * @en TWhether to display the outer border
965
+ */
966
+ wrapper?: boolean;
967
+ /**
968
+ * @zh 是否展示单元格边框(表头+主体)
969
+ * @en Whether to display the cell border (header + body)
970
+ */
971
+ cell?: boolean;
972
+ /**
973
+ * @zh 是否展示表头单元格边框
974
+ * @en Whether to display the header cell border
975
+ */
976
+ headerCell?: boolean;
977
+ /**
978
+ * @zh 是否展示主体单元格边框
979
+ * @en Whether to display the body cell border
980
+ */
981
+ bodyCell?: boolean;
982
+ }
983
+
984
+ interface TableRowSelection {
985
+ /**
986
+ * @zh 行选择器的类型
987
+ * @en The type of row selector
988
+ */
989
+ type?: 'checkbox' | 'radio';
990
+ /**
991
+ * @zh 已选择的行(受控模式)
992
+ * @en Selected row (controlled mode)
993
+ */
994
+ selectedRowKeys?: BaseType[];
995
+ /**
996
+ * @zh 默认已选择的行(非受控模式)
997
+ * @en The selected row by default (uncontrolled mode)
998
+ */
999
+ defaultSelectedRowKeys?: BaseType[];
1000
+ /**
1001
+ * @zh 是否显示全选选择器
1002
+ * @en Whether to show the select all selector
1003
+ */
1004
+ showCheckedAll?: boolean;
1005
+ /**
1006
+ * @zh 列标题
1007
+ * @en Column title
1008
+ */
1009
+ title?: string;
1010
+ /**
1011
+ * @zh 列宽度
1012
+ * @en Column width
1013
+ */
1014
+ width?: number;
1015
+ /**
1016
+ * @zh 是否固定
1017
+ * @en Is it fixed
1018
+ */
1019
+ fixed?: boolean;
1020
+ /**
1021
+ * @zh 是否开启严格选择模式
1022
+ * @en Whether to enable strict selection mode
1023
+ * @defaultValue true
1024
+ * @version 2.29.0
1025
+ */
1026
+ checkStrictly?: boolean;
1027
+ /**
1028
+ * @zh 是否仅展示当前页的 keys(切换分页时清空 keys)
1029
+ * @en Whether to display only the keys of the current page (clear keys when switching paging)
1030
+ * @version 2.32.0
1031
+ */
1032
+ onlyCurrent?: boolean;
1033
+ }
1034
+
1035
+ interface TableExpandable {
1036
+ /**
1037
+ * @zh 显示的展开行(受控模式)
1038
+ * @en Displayed Expanded Row (Controlled Mode)
1039
+ */
1040
+ expandedRowKeys?: BaseType[];
1041
+ /**
1042
+ * @zh 默认显示的展开行(非受控模式)
1043
+ * @en Expand row displayed by default (Uncontrolled mode)
1044
+ */
1045
+ defaultExpandedRowKeys?: BaseType[];
1046
+ /**
1047
+ * @zh 是否默认展开所有的行
1048
+ * @en Whether to expand all rows by default
1049
+ */
1050
+ defaultExpandAllRows?: boolean;
1051
+ /**
1052
+ * @zh 自定义展开行内容
1053
+ * @en Customize expanded row content
1054
+ */
1055
+ expandedRowRender?: (record: TableData) => VNodeChild;
1056
+ /**
1057
+ * @zh 展开图标
1058
+ * @en Expand icon
1059
+ */
1060
+ icon?: (expanded: boolean, record: TableData) => VNodeChild;
1061
+ /**
1062
+ * @zh 列标题
1063
+ * @en Column title
1064
+ */
1065
+ title?: string;
1066
+ /**
1067
+ * @zh 列宽度
1068
+ * @en Column width
1069
+ */
1070
+ width?: number;
1071
+ /**
1072
+ * @zh 是否固定
1073
+ * @en Is it fixed
1074
+ */
1075
+ fixed?: boolean;
1076
+ }
1077
+
1078
+ interface TableDraggable {
1079
+ /**
1080
+ * @zh 拖拽类型
1081
+ * @en drag type
1082
+ */
1083
+ type?: 'row' | 'handle';
1084
+ /**
1085
+ * @zh 列标题
1086
+ * @en Column title
1087
+ */
1088
+ title?: string;
1089
+ /**
1090
+ * @zh 列宽度
1091
+ * @en Column width
1092
+ */
1093
+ width?: number;
1094
+ /**
1095
+ * @zh 是否固定
1096
+ * @en Is it fixed
1097
+ */
1098
+ fixed?: boolean;
1099
+ }
1100
+
1101
+ type OperationName = 'selection-checkbox' | 'selection-radio' | 'expand' | 'drag-handle';
1102
+
1103
+ interface TableOperationColumn {
1104
+ name: OperationName | string;
1105
+ title?: string | RenderFunction;
1106
+ width?: number;
1107
+ fixed?: boolean;
1108
+ render?: (record: TableData) => VNodeChild;
1109
+ isLastLeftFixed?: boolean;
1110
+ }
1111
+
1112
+ interface TableComponents {
1113
+ operations: (operations: {
1114
+ dragHandle?: TableOperationColumn;
1115
+ expand?: TableOperationColumn;
1116
+ selection?: TableOperationColumn;
1117
+ }) => TableOperationColumn[];
1118
+ }
1119
+
1120
+ interface TableChangeExtra {
1121
+ /**
1122
+ * @zh 触发类型
1123
+ * @en Trigger type
1124
+ */
1125
+ type: 'pagination' | 'sorter' | 'filter' | 'drag';
1126
+ /**
1127
+ * @zh 页码
1128
+ * @en page number
1129
+ */
1130
+ page?: number;
1131
+ /**
1132
+ * @zh 每页数据数
1133
+ * @en number per page
1134
+ */
1135
+ pageSize?: number;
1136
+ /**
1137
+ * @zh 排序信息
1138
+ * @en Sort information
1139
+ */
1140
+ sorter?: Sorter;
1141
+ /** 按优先级排列的全部排序条件;sorter 保留首个条件以兼容已有消费方。 */
1142
+ sorters?: Sorter[];
1143
+ /**
1144
+ * @zh 筛选信息
1145
+ * @en Filter information
1146
+ */
1147
+ filters?: Filters;
1148
+ /**
1149
+ * @zh 拖拽信息
1150
+ * @en Drag and drop information
1151
+ */
1152
+ dragTarget?: TableData;
1153
+ }
1154
+
1155
+ interface TableInternalProps {
1156
+ columns: TableColumnData[];
1157
+ data: TableData[];
1158
+ bordered?: boolean | TableBorder;
1159
+ rowSelection?: TableRowSelection;
1160
+ expandable?: TableExpandable;
1161
+ pagination?: boolean | Data;
1162
+ pagePosition?: string;
1163
+ }
1164
+
1165
+ type Sorter = {
1166
+ field: string;
1167
+ direction: 'ascend' | 'descend';
1168
+ };
1169
+
1170
+ type Filters = Record<string, string[]>;
1171
+
1172
+ declare const TD_TYPES: readonly ["normal", "operation", "checkbox", "radio", "expand"];
1173
+
1174
+ type TdTypes = (typeof TD_TYPES)[number];
1175
+
1176
+ type TableInstance = InstanceType<typeof _Table>;
1177
+
1178
+ type TableProps = InstanceType<typeof _Table>['$props'];
1179
+
1180
+ type TheadInstance = InstanceType<typeof _Thead>;
1181
+
1182
+ type TbodyInstance = InstanceType<typeof _Tbody>;
1183
+
1184
+ type TrInstance = InstanceType<typeof _Tr>;
1185
+
1186
+ type ThInstance = InstanceType<typeof _Th>;
1187
+
1188
+ type TdInstance = InstanceType<typeof _Td>;
1189
+
1190
+ type TableColumnInstance = InstanceType<typeof _TableColumn>;
1191
+ ```
1192
+
1193
+
1194
+ ## Tbody API
1195
+
1196
+ 公开声明:`dist/components/table/table-tbody.d.ts`。 类型中的 undefined 表示可省略;原始 prop 默认值不等于继承配置或服务默认值。
1197
+
1198
+ ### Props
1199
+
1200
+ 未声明自身 props;包装透传能力见本页用法。
1201
+
1202
+ ### Events
1203
+
1204
+ 未声明组件 emits;原生事件与包装透传按本页用法核实。
1205
+
1206
+ ### Slots
1207
+
1208
+ 公开类型未逐项声明插槽;本页场景说明列出实际使用的插槽,不将任意插槽视为已支持。
1209
+
1210
+ ### 实例方法
1211
+
1212
+ 没有检索到显式 expose 或 Options API methods 的公开方法;不把 setup 内部函数当成稳定实例 API。
1213
+
1214
+
1215
+ ## Td API
1216
+
1217
+ 公开声明:`dist/components/table/table-td.d.ts`。 类型中的 undefined 表示可省略;原始 prop 默认值不等于继承配置或服务默认值。
1218
+
1219
+ ### Props
1220
+
1221
+ | 名称 | 用途 | 公开类型 | 必填 | 声明默认值 |
1222
+ | --- | --- | --- | --- | --- |
1223
+ | tabindex | 见场景用法与类型 | undefined &#124; string &#124; number | 否 | 未声明 |
1224
+ | onClick | 见场景用法与类型 | undefined &#124; (event: MouseEvent) => void | 否 | 未声明 |
1225
+ | onDblclick | 见场景用法与类型 | undefined &#124; (event: MouseEvent) => void | 否 | 未声明 |
1226
+ | onContextmenu | 见场景用法与类型 | undefined &#124; (event: MouseEvent) => void | 否 | 未声明 |
1227
+ | onMouseenter | 见场景用法与类型 | undefined &#124; (event: MouseEvent) => void | 否 | 未声明 |
1228
+ | onMouseleave | 见场景用法与类型 | undefined &#124; (event: MouseEvent) => void | 否 | 未声明 |
1229
+ | onDragstart | 见场景用法与类型 | undefined &#124; (event: DragEvent) => void | 否 | 未声明 |
1230
+ | onDragend | 见场景用法与类型 | undefined &#124; (event: DragEvent) => void | 否 | 未声明 |
1231
+ | onDragenter | 见场景用法与类型 | undefined &#124; (event: DragEvent) => void | 否 | 未声明 |
1232
+ | onDragover | 见场景用法与类型 | undefined &#124; (event: DragEvent) => void | 否 | 未声明 |
1233
+ | onDrop | 见场景用法与类型 | undefined &#124; (event: DragEvent) => void | 否 | 未声明 |
1234
+ | onKeydown | 见场景用法与类型 | undefined &#124; (event: KeyboardEvent) => void | 否 | 未声明 |
1235
+ | onFocus | 见场景用法与类型 | undefined &#124; (event: FocusEvent) => void | 否 | 未声明 |
1236
+ | onPointerdown | 见场景用法与类型 | undefined &#124; (event: PointerEvent) => void | 否 | 未声明 |
1237
+ | onPointermove | 见场景用法与类型 | undefined &#124; (event: PointerEvent) => void | 否 | 未声明 |
1238
+ | onPointerup | 见场景用法与类型 | undefined &#124; (event: PointerEvent) => void | 否 | 未声明 |
1239
+ | onPointercancel | 见场景用法与类型 | undefined &#124; (event: PointerEvent) => void | 否 | 未声明 |
1240
+ | rowIndex | 见场景用法与类型 | undefined &#124; number | 否 | 未声明 |
1241
+ | record | 见场景用法与类型 | undefined &#124; TableDataWithRaw | 否 | {} |
1242
+ | column | 见场景用法与类型 | undefined &#124; TableColumnData | 否 | {} |
1243
+ | type | 见场景用法与类型 | undefined &#124; "normal" &#124; "radio" &#124; "expand" &#124; "checkbox" &#124; "operation" | 否 | "normal" |
1244
+ | operations | 见场景用法与类型 | undefined &#124; TableOperationColumn[] | 否 | [] |
1245
+ | dataColumns | 见场景用法与类型 | undefined &#124; TableColumnData[] | 否 | [] |
1246
+ | colSpan | 见场景用法与类型 | undefined &#124; number | 否 | 1 |
1247
+ | rowSpan | 见场景用法与类型 | undefined &#124; number | 否 | 1 |
1248
+ | isFixedExpand | 见场景用法与类型 | undefined &#124; false &#124; true | 否 | false |
1249
+ | containerWidth | 见场景用法与类型 | undefined &#124; number | 否 | 未声明 |
1250
+ | showExpandBtn | 见场景用法与类型 | undefined &#124; false &#124; true | 否 | false |
1251
+ | indentSize | 见场景用法与类型 | undefined &#124; number | 否 | 0 |
1252
+ | renderExpandBtn | 见场景用法与类型 | undefined &#124; (record: TableDataWithRaw, stopPropagation?: boolean, loading?: boolean) => VNode | 否 | 未声明 |
1253
+ | summary | 见场景用法与类型 | undefined &#124; false &#124; true | 否 | false |
1254
+
1255
+ ### Events
1256
+
1257
+ | 事件 | 用途 | 监听器签名(即事件参数) |
1258
+ | --- | --- | --- |
1259
+ | click | 见场景用法与类型 | undefined &#124; (event: MouseEvent) => void |
1260
+ | focus | 见场景用法与类型 | undefined &#124; (event: FocusEvent) => void |
1261
+ | keydown | 见场景用法与类型 | undefined &#124; (event: KeyboardEvent) => void |
1262
+ | dblclick | 见场景用法与类型 | undefined &#124; (event: MouseEvent) => void |
1263
+ | contextmenu | 见场景用法与类型 | undefined &#124; (event: MouseEvent) => void |
1264
+ | mouseenter | 见场景用法与类型 | undefined &#124; (event: MouseEvent) => void |
1265
+ | mouseleave | 见场景用法与类型 | undefined &#124; (event: MouseEvent) => void |
1266
+ | dragstart | 见场景用法与类型 | undefined &#124; (event: DragEvent) => void |
1267
+ | dragend | 见场景用法与类型 | undefined &#124; (event: DragEvent) => void |
1268
+ | dragenter | 见场景用法与类型 | undefined &#124; (event: DragEvent) => void |
1269
+ | dragover | 见场景用法与类型 | undefined &#124; (event: DragEvent) => void |
1270
+ | drop | 见场景用法与类型 | undefined &#124; (event: DragEvent) => void |
1271
+ | pointerdown | 见场景用法与类型 | undefined &#124; (event: PointerEvent) => void |
1272
+ | pointermove | 见场景用法与类型 | undefined &#124; (event: PointerEvent) => void |
1273
+ | pointerup | 见场景用法与类型 | undefined &#124; (event: PointerEvent) => void |
1274
+ | pointercancel | 见场景用法与类型 | undefined &#124; (event: PointerEvent) => void |
1275
+
1276
+ ### Slots
1277
+
1278
+ 公开类型未逐项声明插槽;本页场景说明列出实际使用的插槽,不将任意插槽视为已支持。
1279
+
1280
+ ### 实例方法
1281
+
1282
+ 没有检索到显式 expose 或 Options API methods 的公开方法;不把 setup 内部函数当成稳定实例 API。
1283
+
1284
+ ### 关联类型定义
1285
+
1286
+ 以下摘自本组件族声明,供查阅嵌套配置;运行时和值类型均以根入口可导出项为准。
1287
+
1288
+ ```typescript-reference
1289
+ declare const TABLE_PAGE_POSITION: readonly ["tl", "top", "tr", "bl", "bottom", "br"];
1290
+
1291
+ type TablePagePosition = (typeof TABLE_PAGE_POSITION)[number];
1292
+
1293
+ interface TableData {
1294
+ /**
1295
+ * @zh 数据行的key
1296
+ * @en The key of the data row
1297
+ */
1298
+ key?: string | number;
1299
+ /**
1300
+ * @zh 扩展行内容
1301
+ * @en Expand row content
1302
+ */
1303
+ expand?: string | RenderFunction;
1304
+ /**
1305
+ * @zh 子数据
1306
+ * @en Sub data
1307
+ */
1308
+ children?: TableData[];
1309
+ /**
1310
+ * @zh 是否禁用行选择器
1311
+ * @en Whether to disable the row selector
1312
+ */
1313
+ disabled?: boolean;
1314
+ /**
1315
+ * @zh 是否是叶子节点
1316
+ * @en Whether it is a leaf node
1317
+ * @version 2.13.0
1318
+ */
1319
+ isLeaf?: boolean;
1320
+ [name: string]: any;
1321
+ }
1322
+
1323
+ interface TableDataWithRaw {
1324
+ raw: TableData;
1325
+ key: string | number;
1326
+ disabled?: boolean;
1327
+ expand?: string | RenderFunction;
1328
+ children?: TableDataWithRaw[];
1329
+ isLeaf?: boolean;
1330
+ hasSubtree?: boolean;
1331
+ }
1332
+
1333
+ interface TableSortable {
1334
+ /**
1335
+ * @zh 支持的排序方向
1336
+ * @en Supported sort direction
1337
+ */
1338
+ sortDirections: ('ascend' | 'descend')[];
1339
+ /**
1340
+ * @zh 排序函数。设置为 `true` 可关闭内部排序。2.19.0 版本修改传出数据。
1341
+ * @en Sorting function. Set to `true` to turn off internal sorting. Version 2.19.0 modifies outgoing data.
1342
+ */
1343
+ sorter?: ((a: TableData, b: TableData, extra: {
1344
+ dataIndex: string;
1345
+ direction: 'ascend' | 'descend';
1346
+ }) => number) | boolean;
1347
+ /**
1348
+ * @zh 排序方向
1349
+ * @en Sort direction
1350
+ */
1351
+ sortOrder?: 'ascend' | 'descend' | '';
1352
+ /**
1353
+ * @zh 默认排序方向(非受控模式)
1354
+ * @en Default sort direction (uncontrolled mode)
1355
+ */
1356
+ defaultSortOrder?: 'ascend' | 'descend' | '';
1357
+ /**
1358
+ * @zh 多列排序优先级,数字越大越先比较;只在声明优先级的列之间保留多列排序。
1359
+ * @en Multi-column sort priority. Higher values are compared first.
1360
+ */
1361
+ sortPriority?: number;
1362
+ }
1363
+
1364
+ interface TableFilterData {
1365
+ /**
1366
+ * @zh 筛选数据选项的内容
1367
+ * @en Filter the content of the data option
1368
+ */
1369
+ text: string | RenderFunction;
1370
+ /**
1371
+ * @zh 筛选数据选项的值
1372
+ * @en Filter the value of the data option
1373
+ */
1374
+ value: string;
1375
+ }
1376
+
1377
+ interface TableFilterable {
1378
+ /**
1379
+ * @zh 筛选数据
1380
+ * @en Filter data
1381
+ */
1382
+ filters?: TableFilterData[];
1383
+ /**
1384
+ * @zh 筛选函数
1385
+ * @en Filter function
1386
+ */
1387
+ filter: (filteredValue: string[], record: TableData) => boolean;
1388
+ /**
1389
+ * @zh 是否支持多选
1390
+ * @en Whether to support multiple selection
1391
+ */
1392
+ multiple?: boolean;
1393
+ /**
1394
+ * @zh 筛选项
1395
+ * @en Filter value
1396
+ */
1397
+ filteredValue?: string[];
1398
+ /**
1399
+ * @zh 默认筛选项
1400
+ * @en Default filter value
1401
+ */
1402
+ defaultFilteredValue?: string[];
1403
+ /**
1404
+ * @zh 筛选框的内容
1405
+ * @en The content of filter box
1406
+ */
1407
+ renderContent?: (data: {
1408
+ filterValue: string[];
1409
+ setFilterValue: (filterValue: string[]) => void;
1410
+ handleFilterConfirm: (event: Event) => void;
1411
+ handleFilterReset: (event: Event) => void;
1412
+ }) => VNodeChild;
1413
+ /**
1414
+ * @zh 筛选按钮的图标
1415
+ * @en Filter icon for button
1416
+ */
1417
+ icon?: RenderFunction;
1418
+ /**
1419
+ * @zh 筛选框的弹出框配置
1420
+ * @en Pop-up box configuration of filter box
1421
+ */
1422
+ triggerProps?: TriggerProps;
1423
+ /**
1424
+ * @zh 筛选图标是否左对齐
1425
+ * @en Whether the filter icon is aligned to the left
1426
+ * @version 2.13.0
1427
+ */
1428
+ alignLeft?: boolean;
1429
+ slotName?: string;
1430
+ }
1431
+
1432
+ interface TableColumnData {
1433
+ /**
1434
+ * @zh 列信息的标识,对应 `TableData` 中的数据
1435
+ * @en The identifier of the column information, corresponding to the data in `TableData`
1436
+ */
1437
+ dataIndex?: string;
1438
+ /**
1439
+ * @zh 列标题
1440
+ * @en Column header
1441
+ */
1442
+ title?: string | RenderFunction;
1443
+ /**
1444
+ * @zh 列宽度
1445
+ * @en Column width
1446
+ */
1447
+ width?: number;
1448
+ /**
1449
+ * @zh 最小列宽
1450
+ * @en Minimum column width
1451
+ */
1452
+ minWidth?: number;
1453
+ /**
1454
+ * @zh 对齐方向
1455
+ * @en Alignment direction
1456
+ */
1457
+ align?: 'left' | 'center' | 'right';
1458
+ /**
1459
+ * @zh 固定位置
1460
+ * @en Fixed position
1461
+ */
1462
+ fixed?: 'left' | 'right';
1463
+ /**
1464
+ * @zh 是否显示省略号
1465
+ * @en Whether to show ellipsis
1466
+ */
1467
+ ellipsis?: boolean;
1468
+ /**
1469
+ * @zh 是否在显示省略号时显示文本提示。可填入 tooltip 组件属性
1470
+ * @en Whether to show a text hint when an ellipsis is displayed. Can be filled in tooltip component properties
1471
+ * @version 2.26.0
1472
+ */
1473
+ tooltip?: boolean | Record<string, any>;
1474
+ /**
1475
+ * @zh 排序相关选项
1476
+ * @en Sorting related options
1477
+ */
1478
+ sortable?: TableSortable;
1479
+ /**
1480
+ * @zh 过滤相关选项
1481
+ * @en Filter related options
1482
+ */
1483
+ filterable?: TableFilterable;
1484
+ /**
1485
+ * @zh 表头子数据,用于表头分组
1486
+ * @en Header sub-data, used for header grouping
1487
+ */
1488
+ children?: TableColumnData[];
1489
+ /**
1490
+ * @zh 自定义单元格类名
1491
+ * @en Custom cell class
1492
+ * @version 2.36.0
1493
+ */
1494
+ cellClass?: ClassName;
1495
+ /**
1496
+ * @zh 自定义表头单元格类名
1497
+ * @en Custom header cell class
1498
+ * @version 2.36.0
1499
+ */
1500
+ headerCellClass?: ClassName;
1501
+ /**
1502
+ * @zh 自定义内容单元格类名
1503
+ * @en Custom body cell class
1504
+ * @version 2.36.0
1505
+ */
1506
+ bodyCellClass?: ClassName | ((record: TableData) => ClassName);
1507
+ /**
1508
+ * @zh 自定义总结栏单元格类名
1509
+ * @en Custom body cell class
1510
+ * @version 2.36.0
1511
+ */
1512
+ summaryCellClass?: ClassName | ((record: TableData) => ClassName);
1513
+ /**
1514
+ * @zh 自定义单元格样式
1515
+ * @en Custom cell style
1516
+ * @version 2.11.0
1517
+ */
1518
+ cellStyle?: CSSProperties;
1519
+ /**
1520
+ * @zh 自定义表头单元格样式
1521
+ * @en Custom header cell style
1522
+ * @version 2.29.0
1523
+ */
1524
+ headerCellStyle?: CSSProperties;
1525
+ /**
1526
+ * @zh 自定义内容单元格样式
1527
+ * @en Custom body cell style
1528
+ * @version 2.29.0
1529
+ */
1530
+ bodyCellStyle?: CSSProperties | ((record: TableData) => CSSProperties);
1531
+ /**
1532
+ * @zh 自定义总结栏单元格样式
1533
+ * @en Custom summary cell style
1534
+ * @version 2.30.0
1535
+ */
1536
+ summaryCellStyle?: CSSProperties | ((record: TableData) => CSSProperties);
1537
+ /**
1538
+ * @zh 自定义列单元格的渲染
1539
+ * @en Customize the rendering of column cells
1540
+ */
1541
+ render?: (data: {
1542
+ record: TableData;
1543
+ column: TableColumnData;
1544
+ rowIndex: number;
1545
+ }) => VNodeChild;
1546
+ /**
1547
+ * @zh 设置当前列的渲染插槽的名字。插槽参数同 #cell
1548
+ * @en Sets the name of the render slot for the current column. Slot parameters are the same as #cell
1549
+ * @version 2.18.0
1550
+ */
1551
+ slotName?: string;
1552
+ /**
1553
+ * @zh 设置当前列的标题的渲染插槽的名字
1554
+ * @en Set the name of the render slot for the header of the current column
1555
+ * @version 2.23.0
1556
+ */
1557
+ titleSlotName?: string;
1558
+ slots?: Slots;
1559
+ isLastLeftFixed?: boolean;
1560
+ isFirstRightFixed?: boolean;
1561
+ colSpan?: number;
1562
+ rowSpan?: number;
1563
+ index?: number;
1564
+ parent?: TableColumnData;
1565
+ _resizeWidth?: number;
1566
+ }
1567
+
1568
+ interface TableBorder {
1569
+ /**
1570
+ * @zh 是否展示外边框
1571
+ * @en TWhether to display the outer border
1572
+ */
1573
+ wrapper?: boolean;
1574
+ /**
1575
+ * @zh 是否展示单元格边框(表头+主体)
1576
+ * @en Whether to display the cell border (header + body)
1577
+ */
1578
+ cell?: boolean;
1579
+ /**
1580
+ * @zh 是否展示表头单元格边框
1581
+ * @en Whether to display the header cell border
1582
+ */
1583
+ headerCell?: boolean;
1584
+ /**
1585
+ * @zh 是否展示主体单元格边框
1586
+ * @en Whether to display the body cell border
1587
+ */
1588
+ bodyCell?: boolean;
1589
+ }
1590
+
1591
+ interface TableRowSelection {
1592
+ /**
1593
+ * @zh 行选择器的类型
1594
+ * @en The type of row selector
1595
+ */
1596
+ type?: 'checkbox' | 'radio';
1597
+ /**
1598
+ * @zh 已选择的行(受控模式)
1599
+ * @en Selected row (controlled mode)
1600
+ */
1601
+ selectedRowKeys?: BaseType[];
1602
+ /**
1603
+ * @zh 默认已选择的行(非受控模式)
1604
+ * @en The selected row by default (uncontrolled mode)
1605
+ */
1606
+ defaultSelectedRowKeys?: BaseType[];
1607
+ /**
1608
+ * @zh 是否显示全选选择器
1609
+ * @en Whether to show the select all selector
1610
+ */
1611
+ showCheckedAll?: boolean;
1612
+ /**
1613
+ * @zh 列标题
1614
+ * @en Column title
1615
+ */
1616
+ title?: string;
1617
+ /**
1618
+ * @zh 列宽度
1619
+ * @en Column width
1620
+ */
1621
+ width?: number;
1622
+ /**
1623
+ * @zh 是否固定
1624
+ * @en Is it fixed
1625
+ */
1626
+ fixed?: boolean;
1627
+ /**
1628
+ * @zh 是否开启严格选择模式
1629
+ * @en Whether to enable strict selection mode
1630
+ * @defaultValue true
1631
+ * @version 2.29.0
1632
+ */
1633
+ checkStrictly?: boolean;
1634
+ /**
1635
+ * @zh 是否仅展示当前页的 keys(切换分页时清空 keys)
1636
+ * @en Whether to display only the keys of the current page (clear keys when switching paging)
1637
+ * @version 2.32.0
1638
+ */
1639
+ onlyCurrent?: boolean;
1640
+ }
1641
+
1642
+ interface TableExpandable {
1643
+ /**
1644
+ * @zh 显示的展开行(受控模式)
1645
+ * @en Displayed Expanded Row (Controlled Mode)
1646
+ */
1647
+ expandedRowKeys?: BaseType[];
1648
+ /**
1649
+ * @zh 默认显示的展开行(非受控模式)
1650
+ * @en Expand row displayed by default (Uncontrolled mode)
1651
+ */
1652
+ defaultExpandedRowKeys?: BaseType[];
1653
+ /**
1654
+ * @zh 是否默认展开所有的行
1655
+ * @en Whether to expand all rows by default
1656
+ */
1657
+ defaultExpandAllRows?: boolean;
1658
+ /**
1659
+ * @zh 自定义展开行内容
1660
+ * @en Customize expanded row content
1661
+ */
1662
+ expandedRowRender?: (record: TableData) => VNodeChild;
1663
+ /**
1664
+ * @zh 展开图标
1665
+ * @en Expand icon
1666
+ */
1667
+ icon?: (expanded: boolean, record: TableData) => VNodeChild;
1668
+ /**
1669
+ * @zh 列标题
1670
+ * @en Column title
1671
+ */
1672
+ title?: string;
1673
+ /**
1674
+ * @zh 列宽度
1675
+ * @en Column width
1676
+ */
1677
+ width?: number;
1678
+ /**
1679
+ * @zh 是否固定
1680
+ * @en Is it fixed
1681
+ */
1682
+ fixed?: boolean;
1683
+ }
1684
+
1685
+ interface TableDraggable {
1686
+ /**
1687
+ * @zh 拖拽类型
1688
+ * @en drag type
1689
+ */
1690
+ type?: 'row' | 'handle';
1691
+ /**
1692
+ * @zh 列标题
1693
+ * @en Column title
1694
+ */
1695
+ title?: string;
1696
+ /**
1697
+ * @zh 列宽度
1698
+ * @en Column width
1699
+ */
1700
+ width?: number;
1701
+ /**
1702
+ * @zh 是否固定
1703
+ * @en Is it fixed
1704
+ */
1705
+ fixed?: boolean;
1706
+ }
1707
+
1708
+ type OperationName = 'selection-checkbox' | 'selection-radio' | 'expand' | 'drag-handle';
1709
+
1710
+ interface TableOperationColumn {
1711
+ name: OperationName | string;
1712
+ title?: string | RenderFunction;
1713
+ width?: number;
1714
+ fixed?: boolean;
1715
+ render?: (record: TableData) => VNodeChild;
1716
+ isLastLeftFixed?: boolean;
1717
+ }
1718
+
1719
+ interface TableComponents {
1720
+ operations: (operations: {
1721
+ dragHandle?: TableOperationColumn;
1722
+ expand?: TableOperationColumn;
1723
+ selection?: TableOperationColumn;
1724
+ }) => TableOperationColumn[];
1725
+ }
1726
+
1727
+ interface TableChangeExtra {
1728
+ /**
1729
+ * @zh 触发类型
1730
+ * @en Trigger type
1731
+ */
1732
+ type: 'pagination' | 'sorter' | 'filter' | 'drag';
1733
+ /**
1734
+ * @zh 页码
1735
+ * @en page number
1736
+ */
1737
+ page?: number;
1738
+ /**
1739
+ * @zh 每页数据数
1740
+ * @en number per page
1741
+ */
1742
+ pageSize?: number;
1743
+ /**
1744
+ * @zh 排序信息
1745
+ * @en Sort information
1746
+ */
1747
+ sorter?: Sorter;
1748
+ /** 按优先级排列的全部排序条件;sorter 保留首个条件以兼容已有消费方。 */
1749
+ sorters?: Sorter[];
1750
+ /**
1751
+ * @zh 筛选信息
1752
+ * @en Filter information
1753
+ */
1754
+ filters?: Filters;
1755
+ /**
1756
+ * @zh 拖拽信息
1757
+ * @en Drag and drop information
1758
+ */
1759
+ dragTarget?: TableData;
1760
+ }
1761
+
1762
+ interface TableInternalProps {
1763
+ columns: TableColumnData[];
1764
+ data: TableData[];
1765
+ bordered?: boolean | TableBorder;
1766
+ rowSelection?: TableRowSelection;
1767
+ expandable?: TableExpandable;
1768
+ pagination?: boolean | Data;
1769
+ pagePosition?: string;
1770
+ }
1771
+
1772
+ type Sorter = {
1773
+ field: string;
1774
+ direction: 'ascend' | 'descend';
1775
+ };
1776
+
1777
+ type Filters = Record<string, string[]>;
1778
+
1779
+ declare const TD_TYPES: readonly ["normal", "operation", "checkbox", "radio", "expand"];
1780
+
1781
+ type TdTypes = (typeof TD_TYPES)[number];
1782
+ ```
1783
+
1784
+
1785
+ ## Th API
1786
+
1787
+ 公开声明:`dist/components/table/table-th.d.ts`。 类型中的 undefined 表示可省略;原始 prop 默认值不等于继承配置或服务默认值。
1788
+
1789
+ ### Props
1790
+
1791
+ | 名称 | 用途 | 公开类型 | 必填 | 声明默认值 |
1792
+ | --- | --- | --- | --- | --- |
1793
+ | tabindex | 见场景用法与类型 | undefined &#124; string &#124; number | 否 | 未声明 |
1794
+ | onClick | 见场景用法与类型 | undefined &#124; (event: MouseEvent) => void | 否 | 未声明 |
1795
+ | onDblclick | 见场景用法与类型 | undefined &#124; (event: MouseEvent) => void | 否 | 未声明 |
1796
+ | onContextmenu | 见场景用法与类型 | undefined &#124; (event: MouseEvent) => void | 否 | 未声明 |
1797
+ | onMouseenter | 见场景用法与类型 | undefined &#124; (event: MouseEvent) => void | 否 | 未声明 |
1798
+ | onMouseleave | 见场景用法与类型 | undefined &#124; (event: MouseEvent) => void | 否 | 未声明 |
1799
+ | onDragstart | 见场景用法与类型 | undefined &#124; (event: DragEvent) => void | 否 | 未声明 |
1800
+ | onDragend | 见场景用法与类型 | undefined &#124; (event: DragEvent) => void | 否 | 未声明 |
1801
+ | onDragenter | 见场景用法与类型 | undefined &#124; (event: DragEvent) => void | 否 | 未声明 |
1802
+ | onDragover | 见场景用法与类型 | undefined &#124; (event: DragEvent) => void | 否 | 未声明 |
1803
+ | onDrop | 见场景用法与类型 | undefined &#124; (event: DragEvent) => void | 否 | 未声明 |
1804
+ | onKeydown | 见场景用法与类型 | undefined &#124; (event: KeyboardEvent) => void | 否 | 未声明 |
1805
+ | onFocus | 见场景用法与类型 | undefined &#124; (event: FocusEvent) => void | 否 | 未声明 |
1806
+ | onPointerdown | 见场景用法与类型 | undefined &#124; (event: PointerEvent) => void | 否 | 未声明 |
1807
+ | onPointermove | 见场景用法与类型 | undefined &#124; (event: PointerEvent) => void | 否 | 未声明 |
1808
+ | onPointerup | 见场景用法与类型 | undefined &#124; (event: PointerEvent) => void | 否 | 未声明 |
1809
+ | onPointercancel | 见场景用法与类型 | undefined &#124; (event: PointerEvent) => void | 否 | 未声明 |
1810
+ | column | 见场景用法与类型 | undefined &#124; TableColumnData | 否 | {} |
1811
+ | operations | 见场景用法与类型 | undefined &#124; TableOperationColumn[] | 否 | [] |
1812
+ | dataColumns | 见场景用法与类型 | undefined &#124; TableColumnData[] | 否 | [] |
1813
+ | resizable | 见场景用法与类型 | undefined &#124; false &#124; true | 否 | false(Vue Boolean 转换) |
1814
+
1815
+ ### Events
1816
+
1817
+ | 事件 | 用途 | 监听器签名(即事件参数) |
1818
+ | --- | --- | --- |
1819
+ | click | 见场景用法与类型 | undefined &#124; (event: MouseEvent) => void |
1820
+ | focus | 见场景用法与类型 | undefined &#124; (event: FocusEvent) => void |
1821
+ | keydown | 见场景用法与类型 | undefined &#124; (event: KeyboardEvent) => void |
1822
+ | dblclick | 见场景用法与类型 | undefined &#124; (event: MouseEvent) => void |
1823
+ | contextmenu | 见场景用法与类型 | undefined &#124; (event: MouseEvent) => void |
1824
+ | mouseenter | 见场景用法与类型 | undefined &#124; (event: MouseEvent) => void |
1825
+ | mouseleave | 见场景用法与类型 | undefined &#124; (event: MouseEvent) => void |
1826
+ | dragstart | 见场景用法与类型 | undefined &#124; (event: DragEvent) => void |
1827
+ | dragend | 见场景用法与类型 | undefined &#124; (event: DragEvent) => void |
1828
+ | dragenter | 见场景用法与类型 | undefined &#124; (event: DragEvent) => void |
1829
+ | dragover | 见场景用法与类型 | undefined &#124; (event: DragEvent) => void |
1830
+ | drop | 见场景用法与类型 | undefined &#124; (event: DragEvent) => void |
1831
+ | pointerdown | 见场景用法与类型 | undefined &#124; (event: PointerEvent) => void |
1832
+ | pointermove | 见场景用法与类型 | undefined &#124; (event: PointerEvent) => void |
1833
+ | pointerup | 见场景用法与类型 | undefined &#124; (event: PointerEvent) => void |
1834
+ | pointercancel | 见场景用法与类型 | undefined &#124; (event: PointerEvent) => void |
1835
+
1836
+ ### Slots
1837
+
1838
+ 公开类型未逐项声明插槽;本页场景说明列出实际使用的插槽,不将任意插槽视为已支持。
1839
+
1840
+ ### 实例方法
1841
+
1842
+ 没有检索到显式 expose 或 Options API methods 的公开方法;不把 setup 内部函数当成稳定实例 API。
1843
+
1844
+ ### 关联类型定义
1845
+
1846
+ 以下摘自本组件族声明,供查阅嵌套配置;运行时和值类型均以根入口可导出项为准。
1847
+
1848
+ ```typescript-reference
1849
+ declare const TABLE_PAGE_POSITION: readonly ["tl", "top", "tr", "bl", "bottom", "br"];
1850
+
1851
+ type TablePagePosition = (typeof TABLE_PAGE_POSITION)[number];
1852
+
1853
+ interface TableData {
1854
+ /**
1855
+ * @zh 数据行的key
1856
+ * @en The key of the data row
1857
+ */
1858
+ key?: string | number;
1859
+ /**
1860
+ * @zh 扩展行内容
1861
+ * @en Expand row content
1862
+ */
1863
+ expand?: string | RenderFunction;
1864
+ /**
1865
+ * @zh 子数据
1866
+ * @en Sub data
1867
+ */
1868
+ children?: TableData[];
1869
+ /**
1870
+ * @zh 是否禁用行选择器
1871
+ * @en Whether to disable the row selector
1872
+ */
1873
+ disabled?: boolean;
1874
+ /**
1875
+ * @zh 是否是叶子节点
1876
+ * @en Whether it is a leaf node
1877
+ * @version 2.13.0
1878
+ */
1879
+ isLeaf?: boolean;
1880
+ [name: string]: any;
1881
+ }
1882
+
1883
+ interface TableDataWithRaw {
1884
+ raw: TableData;
1885
+ key: string | number;
1886
+ disabled?: boolean;
1887
+ expand?: string | RenderFunction;
1888
+ children?: TableDataWithRaw[];
1889
+ isLeaf?: boolean;
1890
+ hasSubtree?: boolean;
1891
+ }
1892
+
1893
+ interface TableSortable {
1894
+ /**
1895
+ * @zh 支持的排序方向
1896
+ * @en Supported sort direction
1897
+ */
1898
+ sortDirections: ('ascend' | 'descend')[];
1899
+ /**
1900
+ * @zh 排序函数。设置为 `true` 可关闭内部排序。2.19.0 版本修改传出数据。
1901
+ * @en Sorting function. Set to `true` to turn off internal sorting. Version 2.19.0 modifies outgoing data.
1902
+ */
1903
+ sorter?: ((a: TableData, b: TableData, extra: {
1904
+ dataIndex: string;
1905
+ direction: 'ascend' | 'descend';
1906
+ }) => number) | boolean;
1907
+ /**
1908
+ * @zh 排序方向
1909
+ * @en Sort direction
1910
+ */
1911
+ sortOrder?: 'ascend' | 'descend' | '';
1912
+ /**
1913
+ * @zh 默认排序方向(非受控模式)
1914
+ * @en Default sort direction (uncontrolled mode)
1915
+ */
1916
+ defaultSortOrder?: 'ascend' | 'descend' | '';
1917
+ /**
1918
+ * @zh 多列排序优先级,数字越大越先比较;只在声明优先级的列之间保留多列排序。
1919
+ * @en Multi-column sort priority. Higher values are compared first.
1920
+ */
1921
+ sortPriority?: number;
1922
+ }
1923
+
1924
+ interface TableFilterData {
1925
+ /**
1926
+ * @zh 筛选数据选项的内容
1927
+ * @en Filter the content of the data option
1928
+ */
1929
+ text: string | RenderFunction;
1930
+ /**
1931
+ * @zh 筛选数据选项的值
1932
+ * @en Filter the value of the data option
1933
+ */
1934
+ value: string;
1935
+ }
1936
+
1937
+ interface TableFilterable {
1938
+ /**
1939
+ * @zh 筛选数据
1940
+ * @en Filter data
1941
+ */
1942
+ filters?: TableFilterData[];
1943
+ /**
1944
+ * @zh 筛选函数
1945
+ * @en Filter function
1946
+ */
1947
+ filter: (filteredValue: string[], record: TableData) => boolean;
1948
+ /**
1949
+ * @zh 是否支持多选
1950
+ * @en Whether to support multiple selection
1951
+ */
1952
+ multiple?: boolean;
1953
+ /**
1954
+ * @zh 筛选项
1955
+ * @en Filter value
1956
+ */
1957
+ filteredValue?: string[];
1958
+ /**
1959
+ * @zh 默认筛选项
1960
+ * @en Default filter value
1961
+ */
1962
+ defaultFilteredValue?: string[];
1963
+ /**
1964
+ * @zh 筛选框的内容
1965
+ * @en The content of filter box
1966
+ */
1967
+ renderContent?: (data: {
1968
+ filterValue: string[];
1969
+ setFilterValue: (filterValue: string[]) => void;
1970
+ handleFilterConfirm: (event: Event) => void;
1971
+ handleFilterReset: (event: Event) => void;
1972
+ }) => VNodeChild;
1973
+ /**
1974
+ * @zh 筛选按钮的图标
1975
+ * @en Filter icon for button
1976
+ */
1977
+ icon?: RenderFunction;
1978
+ /**
1979
+ * @zh 筛选框的弹出框配置
1980
+ * @en Pop-up box configuration of filter box
1981
+ */
1982
+ triggerProps?: TriggerProps;
1983
+ /**
1984
+ * @zh 筛选图标是否左对齐
1985
+ * @en Whether the filter icon is aligned to the left
1986
+ * @version 2.13.0
1987
+ */
1988
+ alignLeft?: boolean;
1989
+ slotName?: string;
1990
+ }
1991
+
1992
+ interface TableColumnData {
1993
+ /**
1994
+ * @zh 列信息的标识,对应 `TableData` 中的数据
1995
+ * @en The identifier of the column information, corresponding to the data in `TableData`
1996
+ */
1997
+ dataIndex?: string;
1998
+ /**
1999
+ * @zh 列标题
2000
+ * @en Column header
2001
+ */
2002
+ title?: string | RenderFunction;
2003
+ /**
2004
+ * @zh 列宽度
2005
+ * @en Column width
2006
+ */
2007
+ width?: number;
2008
+ /**
2009
+ * @zh 最小列宽
2010
+ * @en Minimum column width
2011
+ */
2012
+ minWidth?: number;
2013
+ /**
2014
+ * @zh 对齐方向
2015
+ * @en Alignment direction
2016
+ */
2017
+ align?: 'left' | 'center' | 'right';
2018
+ /**
2019
+ * @zh 固定位置
2020
+ * @en Fixed position
2021
+ */
2022
+ fixed?: 'left' | 'right';
2023
+ /**
2024
+ * @zh 是否显示省略号
2025
+ * @en Whether to show ellipsis
2026
+ */
2027
+ ellipsis?: boolean;
2028
+ /**
2029
+ * @zh 是否在显示省略号时显示文本提示。可填入 tooltip 组件属性
2030
+ * @en Whether to show a text hint when an ellipsis is displayed. Can be filled in tooltip component properties
2031
+ * @version 2.26.0
2032
+ */
2033
+ tooltip?: boolean | Record<string, any>;
2034
+ /**
2035
+ * @zh 排序相关选项
2036
+ * @en Sorting related options
2037
+ */
2038
+ sortable?: TableSortable;
2039
+ /**
2040
+ * @zh 过滤相关选项
2041
+ * @en Filter related options
2042
+ */
2043
+ filterable?: TableFilterable;
2044
+ /**
2045
+ * @zh 表头子数据,用于表头分组
2046
+ * @en Header sub-data, used for header grouping
2047
+ */
2048
+ children?: TableColumnData[];
2049
+ /**
2050
+ * @zh 自定义单元格类名
2051
+ * @en Custom cell class
2052
+ * @version 2.36.0
2053
+ */
2054
+ cellClass?: ClassName;
2055
+ /**
2056
+ * @zh 自定义表头单元格类名
2057
+ * @en Custom header cell class
2058
+ * @version 2.36.0
2059
+ */
2060
+ headerCellClass?: ClassName;
2061
+ /**
2062
+ * @zh 自定义内容单元格类名
2063
+ * @en Custom body cell class
2064
+ * @version 2.36.0
2065
+ */
2066
+ bodyCellClass?: ClassName | ((record: TableData) => ClassName);
2067
+ /**
2068
+ * @zh 自定义总结栏单元格类名
2069
+ * @en Custom body cell class
2070
+ * @version 2.36.0
2071
+ */
2072
+ summaryCellClass?: ClassName | ((record: TableData) => ClassName);
2073
+ /**
2074
+ * @zh 自定义单元格样式
2075
+ * @en Custom cell style
2076
+ * @version 2.11.0
2077
+ */
2078
+ cellStyle?: CSSProperties;
2079
+ /**
2080
+ * @zh 自定义表头单元格样式
2081
+ * @en Custom header cell style
2082
+ * @version 2.29.0
2083
+ */
2084
+ headerCellStyle?: CSSProperties;
2085
+ /**
2086
+ * @zh 自定义内容单元格样式
2087
+ * @en Custom body cell style
2088
+ * @version 2.29.0
2089
+ */
2090
+ bodyCellStyle?: CSSProperties | ((record: TableData) => CSSProperties);
2091
+ /**
2092
+ * @zh 自定义总结栏单元格样式
2093
+ * @en Custom summary cell style
2094
+ * @version 2.30.0
2095
+ */
2096
+ summaryCellStyle?: CSSProperties | ((record: TableData) => CSSProperties);
2097
+ /**
2098
+ * @zh 自定义列单元格的渲染
2099
+ * @en Customize the rendering of column cells
2100
+ */
2101
+ render?: (data: {
2102
+ record: TableData;
2103
+ column: TableColumnData;
2104
+ rowIndex: number;
2105
+ }) => VNodeChild;
2106
+ /**
2107
+ * @zh 设置当前列的渲染插槽的名字。插槽参数同 #cell
2108
+ * @en Sets the name of the render slot for the current column. Slot parameters are the same as #cell
2109
+ * @version 2.18.0
2110
+ */
2111
+ slotName?: string;
2112
+ /**
2113
+ * @zh 设置当前列的标题的渲染插槽的名字
2114
+ * @en Set the name of the render slot for the header of the current column
2115
+ * @version 2.23.0
2116
+ */
2117
+ titleSlotName?: string;
2118
+ slots?: Slots;
2119
+ isLastLeftFixed?: boolean;
2120
+ isFirstRightFixed?: boolean;
2121
+ colSpan?: number;
2122
+ rowSpan?: number;
2123
+ index?: number;
2124
+ parent?: TableColumnData;
2125
+ _resizeWidth?: number;
2126
+ }
2127
+
2128
+ interface TableBorder {
2129
+ /**
2130
+ * @zh 是否展示外边框
2131
+ * @en TWhether to display the outer border
2132
+ */
2133
+ wrapper?: boolean;
2134
+ /**
2135
+ * @zh 是否展示单元格边框(表头+主体)
2136
+ * @en Whether to display the cell border (header + body)
2137
+ */
2138
+ cell?: boolean;
2139
+ /**
2140
+ * @zh 是否展示表头单元格边框
2141
+ * @en Whether to display the header cell border
2142
+ */
2143
+ headerCell?: boolean;
2144
+ /**
2145
+ * @zh 是否展示主体单元格边框
2146
+ * @en Whether to display the body cell border
2147
+ */
2148
+ bodyCell?: boolean;
2149
+ }
2150
+
2151
+ interface TableRowSelection {
2152
+ /**
2153
+ * @zh 行选择器的类型
2154
+ * @en The type of row selector
2155
+ */
2156
+ type?: 'checkbox' | 'radio';
2157
+ /**
2158
+ * @zh 已选择的行(受控模式)
2159
+ * @en Selected row (controlled mode)
2160
+ */
2161
+ selectedRowKeys?: BaseType[];
2162
+ /**
2163
+ * @zh 默认已选择的行(非受控模式)
2164
+ * @en The selected row by default (uncontrolled mode)
2165
+ */
2166
+ defaultSelectedRowKeys?: BaseType[];
2167
+ /**
2168
+ * @zh 是否显示全选选择器
2169
+ * @en Whether to show the select all selector
2170
+ */
2171
+ showCheckedAll?: boolean;
2172
+ /**
2173
+ * @zh 列标题
2174
+ * @en Column title
2175
+ */
2176
+ title?: string;
2177
+ /**
2178
+ * @zh 列宽度
2179
+ * @en Column width
2180
+ */
2181
+ width?: number;
2182
+ /**
2183
+ * @zh 是否固定
2184
+ * @en Is it fixed
2185
+ */
2186
+ fixed?: boolean;
2187
+ /**
2188
+ * @zh 是否开启严格选择模式
2189
+ * @en Whether to enable strict selection mode
2190
+ * @defaultValue true
2191
+ * @version 2.29.0
2192
+ */
2193
+ checkStrictly?: boolean;
2194
+ /**
2195
+ * @zh 是否仅展示当前页的 keys(切换分页时清空 keys)
2196
+ * @en Whether to display only the keys of the current page (clear keys when switching paging)
2197
+ * @version 2.32.0
2198
+ */
2199
+ onlyCurrent?: boolean;
2200
+ }
2201
+
2202
+ interface TableExpandable {
2203
+ /**
2204
+ * @zh 显示的展开行(受控模式)
2205
+ * @en Displayed Expanded Row (Controlled Mode)
2206
+ */
2207
+ expandedRowKeys?: BaseType[];
2208
+ /**
2209
+ * @zh 默认显示的展开行(非受控模式)
2210
+ * @en Expand row displayed by default (Uncontrolled mode)
2211
+ */
2212
+ defaultExpandedRowKeys?: BaseType[];
2213
+ /**
2214
+ * @zh 是否默认展开所有的行
2215
+ * @en Whether to expand all rows by default
2216
+ */
2217
+ defaultExpandAllRows?: boolean;
2218
+ /**
2219
+ * @zh 自定义展开行内容
2220
+ * @en Customize expanded row content
2221
+ */
2222
+ expandedRowRender?: (record: TableData) => VNodeChild;
2223
+ /**
2224
+ * @zh 展开图标
2225
+ * @en Expand icon
2226
+ */
2227
+ icon?: (expanded: boolean, record: TableData) => VNodeChild;
2228
+ /**
2229
+ * @zh 列标题
2230
+ * @en Column title
2231
+ */
2232
+ title?: string;
2233
+ /**
2234
+ * @zh 列宽度
2235
+ * @en Column width
2236
+ */
2237
+ width?: number;
2238
+ /**
2239
+ * @zh 是否固定
2240
+ * @en Is it fixed
2241
+ */
2242
+ fixed?: boolean;
2243
+ }
2244
+
2245
+ interface TableDraggable {
2246
+ /**
2247
+ * @zh 拖拽类型
2248
+ * @en drag type
2249
+ */
2250
+ type?: 'row' | 'handle';
2251
+ /**
2252
+ * @zh 列标题
2253
+ * @en Column title
2254
+ */
2255
+ title?: string;
2256
+ /**
2257
+ * @zh 列宽度
2258
+ * @en Column width
2259
+ */
2260
+ width?: number;
2261
+ /**
2262
+ * @zh 是否固定
2263
+ * @en Is it fixed
2264
+ */
2265
+ fixed?: boolean;
2266
+ }
2267
+
2268
+ type OperationName = 'selection-checkbox' | 'selection-radio' | 'expand' | 'drag-handle';
2269
+
2270
+ interface TableOperationColumn {
2271
+ name: OperationName | string;
2272
+ title?: string | RenderFunction;
2273
+ width?: number;
2274
+ fixed?: boolean;
2275
+ render?: (record: TableData) => VNodeChild;
2276
+ isLastLeftFixed?: boolean;
2277
+ }
2278
+
2279
+ interface TableComponents {
2280
+ operations: (operations: {
2281
+ dragHandle?: TableOperationColumn;
2282
+ expand?: TableOperationColumn;
2283
+ selection?: TableOperationColumn;
2284
+ }) => TableOperationColumn[];
2285
+ }
2286
+
2287
+ interface TableChangeExtra {
2288
+ /**
2289
+ * @zh 触发类型
2290
+ * @en Trigger type
2291
+ */
2292
+ type: 'pagination' | 'sorter' | 'filter' | 'drag';
2293
+ /**
2294
+ * @zh 页码
2295
+ * @en page number
2296
+ */
2297
+ page?: number;
2298
+ /**
2299
+ * @zh 每页数据数
2300
+ * @en number per page
2301
+ */
2302
+ pageSize?: number;
2303
+ /**
2304
+ * @zh 排序信息
2305
+ * @en Sort information
2306
+ */
2307
+ sorter?: Sorter;
2308
+ /** 按优先级排列的全部排序条件;sorter 保留首个条件以兼容已有消费方。 */
2309
+ sorters?: Sorter[];
2310
+ /**
2311
+ * @zh 筛选信息
2312
+ * @en Filter information
2313
+ */
2314
+ filters?: Filters;
2315
+ /**
2316
+ * @zh 拖拽信息
2317
+ * @en Drag and drop information
2318
+ */
2319
+ dragTarget?: TableData;
2320
+ }
2321
+
2322
+ interface TableInternalProps {
2323
+ columns: TableColumnData[];
2324
+ data: TableData[];
2325
+ bordered?: boolean | TableBorder;
2326
+ rowSelection?: TableRowSelection;
2327
+ expandable?: TableExpandable;
2328
+ pagination?: boolean | Data;
2329
+ pagePosition?: string;
2330
+ }
2331
+
2332
+ type Sorter = {
2333
+ field: string;
2334
+ direction: 'ascend' | 'descend';
2335
+ };
2336
+
2337
+ type Filters = Record<string, string[]>;
2338
+ ```
2339
+
2340
+
2341
+ ## Thead API
2342
+
2343
+ 公开声明:`dist/components/table/table-thead.d.ts`。 类型中的 undefined 表示可省略;原始 prop 默认值不等于继承配置或服务默认值。
2344
+
2345
+ ### Props
2346
+
2347
+ 未声明自身 props;包装透传能力见本页用法。
2348
+
2349
+ ### Events
2350
+
2351
+ 未声明组件 emits;原生事件与包装透传按本页用法核实。
2352
+
2353
+ ### Slots
2354
+
2355
+ 公开类型未逐项声明插槽;本页场景说明列出实际使用的插槽,不将任意插槽视为已支持。
2356
+
2357
+ ### 实例方法
2358
+
2359
+ 没有检索到显式 expose 或 Options API methods 的公开方法;不把 setup 内部函数当成稳定实例 API。
2360
+
2361
+
2362
+ ## Tr API
2363
+
2364
+ 公开声明:`dist/components/table/table-tr.d.ts`。 类型中的 undefined 表示可省略;原始 prop 默认值不等于继承配置或服务默认值。
2365
+
2366
+ ### Props
2367
+
2368
+ | 名称 | 用途 | 公开类型 | 必填 | 声明默认值 |
2369
+ | --- | --- | --- | --- | --- |
2370
+ | tabindex | 见场景用法与类型 | undefined &#124; string &#124; number | 否 | 未声明 |
2371
+ | onClick | 见场景用法与类型 | undefined &#124; (event: MouseEvent) => void | 否 | 未声明 |
2372
+ | onDblclick | 见场景用法与类型 | undefined &#124; (event: MouseEvent) => void | 否 | 未声明 |
2373
+ | onContextmenu | 见场景用法与类型 | undefined &#124; (event: MouseEvent) => void | 否 | 未声明 |
2374
+ | onMouseenter | 见场景用法与类型 | undefined &#124; (event: MouseEvent) => void | 否 | 未声明 |
2375
+ | onMouseleave | 见场景用法与类型 | undefined &#124; (event: MouseEvent) => void | 否 | 未声明 |
2376
+ | onDragstart | 见场景用法与类型 | undefined &#124; (event: DragEvent) => void | 否 | 未声明 |
2377
+ | onDragend | 见场景用法与类型 | undefined &#124; (event: DragEvent) => void | 否 | 未声明 |
2378
+ | onDragenter | 见场景用法与类型 | undefined &#124; (event: DragEvent) => void | 否 | 未声明 |
2379
+ | onDragover | 见场景用法与类型 | undefined &#124; (event: DragEvent) => void | 否 | 未声明 |
2380
+ | onDrop | 见场景用法与类型 | undefined &#124; (event: DragEvent) => void | 否 | 未声明 |
2381
+ | onKeydown | 见场景用法与类型 | undefined &#124; (event: KeyboardEvent) => void | 否 | 未声明 |
2382
+ | onFocus | 见场景用法与类型 | undefined &#124; (event: FocusEvent) => void | 否 | 未声明 |
2383
+ | onPointerdown | 见场景用法与类型 | undefined &#124; (event: PointerEvent) => void | 否 | 未声明 |
2384
+ | onPointermove | 见场景用法与类型 | undefined &#124; (event: PointerEvent) => void | 否 | 未声明 |
2385
+ | onPointerup | 见场景用法与类型 | undefined &#124; (event: PointerEvent) => void | 否 | 未声明 |
2386
+ | onPointercancel | 见场景用法与类型 | undefined &#124; (event: PointerEvent) => void | 否 | 未声明 |
2387
+ | expand | 见场景用法与类型 | undefined &#124; false &#124; true | 否 | false(Vue Boolean 转换) |
2388
+ | empty | 见场景用法与类型 | undefined &#124; false &#124; true | 否 | false(Vue Boolean 转换) |
2389
+ | checked | 见场景用法与类型 | undefined &#124; false &#124; true | 否 | false(Vue Boolean 转换) |
2390
+ | rowIndex | 见场景用法与类型 | undefined &#124; number | 否 | 未声明 |
2391
+ | record | 见场景用法与类型 | undefined &#124; TableDataWithRaw | 否 | {} |
2392
+
2393
+ ### Events
2394
+
2395
+ | 事件 | 用途 | 监听器签名(即事件参数) |
2396
+ | --- | --- | --- |
2397
+ | click | 见场景用法与类型 | undefined &#124; (event: MouseEvent) => void |
2398
+ | focus | 见场景用法与类型 | undefined &#124; (event: FocusEvent) => void |
2399
+ | keydown | 见场景用法与类型 | undefined &#124; (event: KeyboardEvent) => void |
2400
+ | dblclick | 见场景用法与类型 | undefined &#124; (event: MouseEvent) => void |
2401
+ | contextmenu | 见场景用法与类型 | undefined &#124; (event: MouseEvent) => void |
2402
+ | mouseenter | 见场景用法与类型 | undefined &#124; (event: MouseEvent) => void |
2403
+ | mouseleave | 见场景用法与类型 | undefined &#124; (event: MouseEvent) => void |
2404
+ | dragstart | 见场景用法与类型 | undefined &#124; (event: DragEvent) => void |
2405
+ | dragend | 见场景用法与类型 | undefined &#124; (event: DragEvent) => void |
2406
+ | dragenter | 见场景用法与类型 | undefined &#124; (event: DragEvent) => void |
2407
+ | dragover | 见场景用法与类型 | undefined &#124; (event: DragEvent) => void |
2408
+ | drop | 见场景用法与类型 | undefined &#124; (event: DragEvent) => void |
2409
+ | pointerdown | 见场景用法与类型 | undefined &#124; (event: PointerEvent) => void |
2410
+ | pointermove | 见场景用法与类型 | undefined &#124; (event: PointerEvent) => void |
2411
+ | pointerup | 见场景用法与类型 | undefined &#124; (event: PointerEvent) => void |
2412
+ | pointercancel | 见场景用法与类型 | undefined &#124; (event: PointerEvent) => void |
2413
+
2414
+ ### Slots
2415
+
2416
+ 公开类型未逐项声明插槽;本页场景说明列出实际使用的插槽,不将任意插槽视为已支持。
2417
+
2418
+ ### 实例方法
2419
+
2420
+ 没有检索到显式 expose 或 Options API methods 的公开方法;不把 setup 内部函数当成稳定实例 API。
2421
+
2422
+ ### 关联类型定义
2423
+
2424
+ 以下摘自本组件族声明,供查阅嵌套配置;运行时和值类型均以根入口可导出项为准。
2425
+
2426
+ ```typescript-reference
2427
+ declare const TABLE_PAGE_POSITION: readonly ["tl", "top", "tr", "bl", "bottom", "br"];
2428
+
2429
+ type TablePagePosition = (typeof TABLE_PAGE_POSITION)[number];
2430
+
2431
+ interface TableData {
2432
+ /**
2433
+ * @zh 数据行的key
2434
+ * @en The key of the data row
2435
+ */
2436
+ key?: string | number;
2437
+ /**
2438
+ * @zh 扩展行内容
2439
+ * @en Expand row content
2440
+ */
2441
+ expand?: string | RenderFunction;
2442
+ /**
2443
+ * @zh 子数据
2444
+ * @en Sub data
2445
+ */
2446
+ children?: TableData[];
2447
+ /**
2448
+ * @zh 是否禁用行选择器
2449
+ * @en Whether to disable the row selector
2450
+ */
2451
+ disabled?: boolean;
2452
+ /**
2453
+ * @zh 是否是叶子节点
2454
+ * @en Whether it is a leaf node
2455
+ * @version 2.13.0
2456
+ */
2457
+ isLeaf?: boolean;
2458
+ [name: string]: any;
2459
+ }
2460
+
2461
+ interface TableDataWithRaw {
2462
+ raw: TableData;
2463
+ key: string | number;
2464
+ disabled?: boolean;
2465
+ expand?: string | RenderFunction;
2466
+ children?: TableDataWithRaw[];
2467
+ isLeaf?: boolean;
2468
+ hasSubtree?: boolean;
2469
+ }
2470
+
2471
+ interface TableSortable {
2472
+ /**
2473
+ * @zh 支持的排序方向
2474
+ * @en Supported sort direction
2475
+ */
2476
+ sortDirections: ('ascend' | 'descend')[];
2477
+ /**
2478
+ * @zh 排序函数。设置为 `true` 可关闭内部排序。2.19.0 版本修改传出数据。
2479
+ * @en Sorting function. Set to `true` to turn off internal sorting. Version 2.19.0 modifies outgoing data.
2480
+ */
2481
+ sorter?: ((a: TableData, b: TableData, extra: {
2482
+ dataIndex: string;
2483
+ direction: 'ascend' | 'descend';
2484
+ }) => number) | boolean;
2485
+ /**
2486
+ * @zh 排序方向
2487
+ * @en Sort direction
2488
+ */
2489
+ sortOrder?: 'ascend' | 'descend' | '';
2490
+ /**
2491
+ * @zh 默认排序方向(非受控模式)
2492
+ * @en Default sort direction (uncontrolled mode)
2493
+ */
2494
+ defaultSortOrder?: 'ascend' | 'descend' | '';
2495
+ /**
2496
+ * @zh 多列排序优先级,数字越大越先比较;只在声明优先级的列之间保留多列排序。
2497
+ * @en Multi-column sort priority. Higher values are compared first.
2498
+ */
2499
+ sortPriority?: number;
2500
+ }
2501
+
2502
+ interface TableFilterData {
2503
+ /**
2504
+ * @zh 筛选数据选项的内容
2505
+ * @en Filter the content of the data option
2506
+ */
2507
+ text: string | RenderFunction;
2508
+ /**
2509
+ * @zh 筛选数据选项的值
2510
+ * @en Filter the value of the data option
2511
+ */
2512
+ value: string;
2513
+ }
2514
+
2515
+ interface TableFilterable {
2516
+ /**
2517
+ * @zh 筛选数据
2518
+ * @en Filter data
2519
+ */
2520
+ filters?: TableFilterData[];
2521
+ /**
2522
+ * @zh 筛选函数
2523
+ * @en Filter function
2524
+ */
2525
+ filter: (filteredValue: string[], record: TableData) => boolean;
2526
+ /**
2527
+ * @zh 是否支持多选
2528
+ * @en Whether to support multiple selection
2529
+ */
2530
+ multiple?: boolean;
2531
+ /**
2532
+ * @zh 筛选项
2533
+ * @en Filter value
2534
+ */
2535
+ filteredValue?: string[];
2536
+ /**
2537
+ * @zh 默认筛选项
2538
+ * @en Default filter value
2539
+ */
2540
+ defaultFilteredValue?: string[];
2541
+ /**
2542
+ * @zh 筛选框的内容
2543
+ * @en The content of filter box
2544
+ */
2545
+ renderContent?: (data: {
2546
+ filterValue: string[];
2547
+ setFilterValue: (filterValue: string[]) => void;
2548
+ handleFilterConfirm: (event: Event) => void;
2549
+ handleFilterReset: (event: Event) => void;
2550
+ }) => VNodeChild;
2551
+ /**
2552
+ * @zh 筛选按钮的图标
2553
+ * @en Filter icon for button
2554
+ */
2555
+ icon?: RenderFunction;
2556
+ /**
2557
+ * @zh 筛选框的弹出框配置
2558
+ * @en Pop-up box configuration of filter box
2559
+ */
2560
+ triggerProps?: TriggerProps;
2561
+ /**
2562
+ * @zh 筛选图标是否左对齐
2563
+ * @en Whether the filter icon is aligned to the left
2564
+ * @version 2.13.0
2565
+ */
2566
+ alignLeft?: boolean;
2567
+ slotName?: string;
2568
+ }
2569
+
2570
+ interface TableColumnData {
2571
+ /**
2572
+ * @zh 列信息的标识,对应 `TableData` 中的数据
2573
+ * @en The identifier of the column information, corresponding to the data in `TableData`
2574
+ */
2575
+ dataIndex?: string;
2576
+ /**
2577
+ * @zh 列标题
2578
+ * @en Column header
2579
+ */
2580
+ title?: string | RenderFunction;
2581
+ /**
2582
+ * @zh 列宽度
2583
+ * @en Column width
2584
+ */
2585
+ width?: number;
2586
+ /**
2587
+ * @zh 最小列宽
2588
+ * @en Minimum column width
2589
+ */
2590
+ minWidth?: number;
2591
+ /**
2592
+ * @zh 对齐方向
2593
+ * @en Alignment direction
2594
+ */
2595
+ align?: 'left' | 'center' | 'right';
2596
+ /**
2597
+ * @zh 固定位置
2598
+ * @en Fixed position
2599
+ */
2600
+ fixed?: 'left' | 'right';
2601
+ /**
2602
+ * @zh 是否显示省略号
2603
+ * @en Whether to show ellipsis
2604
+ */
2605
+ ellipsis?: boolean;
2606
+ /**
2607
+ * @zh 是否在显示省略号时显示文本提示。可填入 tooltip 组件属性
2608
+ * @en Whether to show a text hint when an ellipsis is displayed. Can be filled in tooltip component properties
2609
+ * @version 2.26.0
2610
+ */
2611
+ tooltip?: boolean | Record<string, any>;
2612
+ /**
2613
+ * @zh 排序相关选项
2614
+ * @en Sorting related options
2615
+ */
2616
+ sortable?: TableSortable;
2617
+ /**
2618
+ * @zh 过滤相关选项
2619
+ * @en Filter related options
2620
+ */
2621
+ filterable?: TableFilterable;
2622
+ /**
2623
+ * @zh 表头子数据,用于表头分组
2624
+ * @en Header sub-data, used for header grouping
2625
+ */
2626
+ children?: TableColumnData[];
2627
+ /**
2628
+ * @zh 自定义单元格类名
2629
+ * @en Custom cell class
2630
+ * @version 2.36.0
2631
+ */
2632
+ cellClass?: ClassName;
2633
+ /**
2634
+ * @zh 自定义表头单元格类名
2635
+ * @en Custom header cell class
2636
+ * @version 2.36.0
2637
+ */
2638
+ headerCellClass?: ClassName;
2639
+ /**
2640
+ * @zh 自定义内容单元格类名
2641
+ * @en Custom body cell class
2642
+ * @version 2.36.0
2643
+ */
2644
+ bodyCellClass?: ClassName | ((record: TableData) => ClassName);
2645
+ /**
2646
+ * @zh 自定义总结栏单元格类名
2647
+ * @en Custom body cell class
2648
+ * @version 2.36.0
2649
+ */
2650
+ summaryCellClass?: ClassName | ((record: TableData) => ClassName);
2651
+ /**
2652
+ * @zh 自定义单元格样式
2653
+ * @en Custom cell style
2654
+ * @version 2.11.0
2655
+ */
2656
+ cellStyle?: CSSProperties;
2657
+ /**
2658
+ * @zh 自定义表头单元格样式
2659
+ * @en Custom header cell style
2660
+ * @version 2.29.0
2661
+ */
2662
+ headerCellStyle?: CSSProperties;
2663
+ /**
2664
+ * @zh 自定义内容单元格样式
2665
+ * @en Custom body cell style
2666
+ * @version 2.29.0
2667
+ */
2668
+ bodyCellStyle?: CSSProperties | ((record: TableData) => CSSProperties);
2669
+ /**
2670
+ * @zh 自定义总结栏单元格样式
2671
+ * @en Custom summary cell style
2672
+ * @version 2.30.0
2673
+ */
2674
+ summaryCellStyle?: CSSProperties | ((record: TableData) => CSSProperties);
2675
+ /**
2676
+ * @zh 自定义列单元格的渲染
2677
+ * @en Customize the rendering of column cells
2678
+ */
2679
+ render?: (data: {
2680
+ record: TableData;
2681
+ column: TableColumnData;
2682
+ rowIndex: number;
2683
+ }) => VNodeChild;
2684
+ /**
2685
+ * @zh 设置当前列的渲染插槽的名字。插槽参数同 #cell
2686
+ * @en Sets the name of the render slot for the current column. Slot parameters are the same as #cell
2687
+ * @version 2.18.0
2688
+ */
2689
+ slotName?: string;
2690
+ /**
2691
+ * @zh 设置当前列的标题的渲染插槽的名字
2692
+ * @en Set the name of the render slot for the header of the current column
2693
+ * @version 2.23.0
2694
+ */
2695
+ titleSlotName?: string;
2696
+ slots?: Slots;
2697
+ isLastLeftFixed?: boolean;
2698
+ isFirstRightFixed?: boolean;
2699
+ colSpan?: number;
2700
+ rowSpan?: number;
2701
+ index?: number;
2702
+ parent?: TableColumnData;
2703
+ _resizeWidth?: number;
2704
+ }
2705
+
2706
+ interface TableBorder {
2707
+ /**
2708
+ * @zh 是否展示外边框
2709
+ * @en TWhether to display the outer border
2710
+ */
2711
+ wrapper?: boolean;
2712
+ /**
2713
+ * @zh 是否展示单元格边框(表头+主体)
2714
+ * @en Whether to display the cell border (header + body)
2715
+ */
2716
+ cell?: boolean;
2717
+ /**
2718
+ * @zh 是否展示表头单元格边框
2719
+ * @en Whether to display the header cell border
2720
+ */
2721
+ headerCell?: boolean;
2722
+ /**
2723
+ * @zh 是否展示主体单元格边框
2724
+ * @en Whether to display the body cell border
2725
+ */
2726
+ bodyCell?: boolean;
2727
+ }
2728
+
2729
+ interface TableRowSelection {
2730
+ /**
2731
+ * @zh 行选择器的类型
2732
+ * @en The type of row selector
2733
+ */
2734
+ type?: 'checkbox' | 'radio';
2735
+ /**
2736
+ * @zh 已选择的行(受控模式)
2737
+ * @en Selected row (controlled mode)
2738
+ */
2739
+ selectedRowKeys?: BaseType[];
2740
+ /**
2741
+ * @zh 默认已选择的行(非受控模式)
2742
+ * @en The selected row by default (uncontrolled mode)
2743
+ */
2744
+ defaultSelectedRowKeys?: BaseType[];
2745
+ /**
2746
+ * @zh 是否显示全选选择器
2747
+ * @en Whether to show the select all selector
2748
+ */
2749
+ showCheckedAll?: boolean;
2750
+ /**
2751
+ * @zh 列标题
2752
+ * @en Column title
2753
+ */
2754
+ title?: string;
2755
+ /**
2756
+ * @zh 列宽度
2757
+ * @en Column width
2758
+ */
2759
+ width?: number;
2760
+ /**
2761
+ * @zh 是否固定
2762
+ * @en Is it fixed
2763
+ */
2764
+ fixed?: boolean;
2765
+ /**
2766
+ * @zh 是否开启严格选择模式
2767
+ * @en Whether to enable strict selection mode
2768
+ * @defaultValue true
2769
+ * @version 2.29.0
2770
+ */
2771
+ checkStrictly?: boolean;
2772
+ /**
2773
+ * @zh 是否仅展示当前页的 keys(切换分页时清空 keys)
2774
+ * @en Whether to display only the keys of the current page (clear keys when switching paging)
2775
+ * @version 2.32.0
2776
+ */
2777
+ onlyCurrent?: boolean;
2778
+ }
2779
+
2780
+ interface TableExpandable {
2781
+ /**
2782
+ * @zh 显示的展开行(受控模式)
2783
+ * @en Displayed Expanded Row (Controlled Mode)
2784
+ */
2785
+ expandedRowKeys?: BaseType[];
2786
+ /**
2787
+ * @zh 默认显示的展开行(非受控模式)
2788
+ * @en Expand row displayed by default (Uncontrolled mode)
2789
+ */
2790
+ defaultExpandedRowKeys?: BaseType[];
2791
+ /**
2792
+ * @zh 是否默认展开所有的行
2793
+ * @en Whether to expand all rows by default
2794
+ */
2795
+ defaultExpandAllRows?: boolean;
2796
+ /**
2797
+ * @zh 自定义展开行内容
2798
+ * @en Customize expanded row content
2799
+ */
2800
+ expandedRowRender?: (record: TableData) => VNodeChild;
2801
+ /**
2802
+ * @zh 展开图标
2803
+ * @en Expand icon
2804
+ */
2805
+ icon?: (expanded: boolean, record: TableData) => VNodeChild;
2806
+ /**
2807
+ * @zh 列标题
2808
+ * @en Column title
2809
+ */
2810
+ title?: string;
2811
+ /**
2812
+ * @zh 列宽度
2813
+ * @en Column width
2814
+ */
2815
+ width?: number;
2816
+ /**
2817
+ * @zh 是否固定
2818
+ * @en Is it fixed
2819
+ */
2820
+ fixed?: boolean;
2821
+ }
2822
+
2823
+ interface TableDraggable {
2824
+ /**
2825
+ * @zh 拖拽类型
2826
+ * @en drag type
2827
+ */
2828
+ type?: 'row' | 'handle';
2829
+ /**
2830
+ * @zh 列标题
2831
+ * @en Column title
2832
+ */
2833
+ title?: string;
2834
+ /**
2835
+ * @zh 列宽度
2836
+ * @en Column width
2837
+ */
2838
+ width?: number;
2839
+ /**
2840
+ * @zh 是否固定
2841
+ * @en Is it fixed
2842
+ */
2843
+ fixed?: boolean;
2844
+ }
2845
+
2846
+ type OperationName = 'selection-checkbox' | 'selection-radio' | 'expand' | 'drag-handle';
2847
+
2848
+ interface TableOperationColumn {
2849
+ name: OperationName | string;
2850
+ title?: string | RenderFunction;
2851
+ width?: number;
2852
+ fixed?: boolean;
2853
+ render?: (record: TableData) => VNodeChild;
2854
+ isLastLeftFixed?: boolean;
2855
+ }
2856
+
2857
+ interface TableComponents {
2858
+ operations: (operations: {
2859
+ dragHandle?: TableOperationColumn;
2860
+ expand?: TableOperationColumn;
2861
+ selection?: TableOperationColumn;
2862
+ }) => TableOperationColumn[];
2863
+ }
2864
+
2865
+ interface TableChangeExtra {
2866
+ /**
2867
+ * @zh 触发类型
2868
+ * @en Trigger type
2869
+ */
2870
+ type: 'pagination' | 'sorter' | 'filter' | 'drag';
2871
+ /**
2872
+ * @zh 页码
2873
+ * @en page number
2874
+ */
2875
+ page?: number;
2876
+ /**
2877
+ * @zh 每页数据数
2878
+ * @en number per page
2879
+ */
2880
+ pageSize?: number;
2881
+ /**
2882
+ * @zh 排序信息
2883
+ * @en Sort information
2884
+ */
2885
+ sorter?: Sorter;
2886
+ /** 按优先级排列的全部排序条件;sorter 保留首个条件以兼容已有消费方。 */
2887
+ sorters?: Sorter[];
2888
+ /**
2889
+ * @zh 筛选信息
2890
+ * @en Filter information
2891
+ */
2892
+ filters?: Filters;
2893
+ /**
2894
+ * @zh 拖拽信息
2895
+ * @en Drag and drop information
2896
+ */
2897
+ dragTarget?: TableData;
2898
+ }
2899
+
2900
+ interface TableInternalProps {
2901
+ columns: TableColumnData[];
2902
+ data: TableData[];
2903
+ bordered?: boolean | TableBorder;
2904
+ rowSelection?: TableRowSelection;
2905
+ expandable?: TableExpandable;
2906
+ pagination?: boolean | Data;
2907
+ pagePosition?: string;
2908
+ }
2909
+
2910
+ type Sorter = {
2911
+ field: string;
2912
+ direction: 'ascend' | 'descend';
2913
+ };
2914
+
2915
+ type Filters = Record<string, string[]>;
2916
+ ```
2917
+
2918
+
2919
+ 返回 [Table 用法](./table.md)。