vxe-table 4.18.6 → 4.18.8

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 (148) hide show
  1. package/LICENSE +20 -20
  2. package/README.en.md +118 -118
  3. package/README.ja-JP.md +117 -117
  4. package/README.md +268 -268
  5. package/README.zh-TW.md +117 -117
  6. package/es/style.css +1 -1
  7. package/es/table/src/table.js +89 -79
  8. package/es/table/src/util.js +6 -0
  9. package/es/table/style.css +18 -48
  10. package/es/ui/index.js +1 -1
  11. package/es/ui/src/dom.js +21 -0
  12. package/es/ui/src/log.js +1 -1
  13. package/es/vxe-table/style.css +18 -48
  14. package/lib/index.common.js +2 -1
  15. package/lib/index.umd.js +2762 -2833
  16. package/lib/index.umd.min.js +1 -1
  17. package/lib/style.css +1 -1
  18. package/lib/table/src/table.js +15 -12
  19. package/lib/table/src/table.min.js +1 -1
  20. package/lib/table/src/util.js +6 -0
  21. package/lib/table/src/util.min.js +1 -1
  22. package/lib/table/style/style.css +18 -48
  23. package/lib/ui/index.js +1 -1
  24. package/lib/ui/index.min.js +1 -1
  25. package/lib/ui/src/dom.js +23 -0
  26. package/lib/ui/src/dom.min.js +1 -1
  27. package/lib/ui/src/log.js +1 -1
  28. package/lib/ui/src/log.min.js +1 -1
  29. package/lib/v-x-e-table/index.js +2 -1
  30. package/lib/v-x-e-table/index.min.js +1 -1
  31. package/lib/vxe-colgroup/index.js +2 -1
  32. package/lib/vxe-colgroup/index.min.js +1 -1
  33. package/lib/vxe-column/index.js +2 -1
  34. package/lib/vxe-column/index.min.js +1 -1
  35. package/lib/vxe-grid/index.js +2 -1
  36. package/lib/vxe-grid/index.min.js +1 -1
  37. package/lib/vxe-table/index.js +2 -1
  38. package/lib/vxe-table/index.min.js +1 -1
  39. package/lib/vxe-table/style/style.css +18 -48
  40. package/lib/vxe-toolbar/index.js +2 -1
  41. package/lib/vxe-toolbar/index.min.js +1 -1
  42. package/lib/vxe-ui/index.js +2 -1
  43. package/lib/vxe-ui/index.min.js +1 -1
  44. package/lib/vxe-v-x-e-table/index.js +2 -1
  45. package/lib/vxe-v-x-e-table/index.min.js +1 -1
  46. package/package.json +91 -91
  47. package/packages/colgroup/index.ts +22 -22
  48. package/packages/column/index.ts +22 -22
  49. package/packages/components.ts +43 -43
  50. package/packages/grid/index.ts +18 -18
  51. package/packages/grid/src/emits.ts +19 -19
  52. package/packages/grid/src/grid.ts +1768 -1768
  53. package/packages/grid/src/props.ts +23 -23
  54. package/packages/index.ts +4 -4
  55. package/packages/locale/lang/ar-EG.ts +832 -832
  56. package/packages/locale/lang/de-DE.ts +832 -832
  57. package/packages/locale/lang/en-US.ts +832 -832
  58. package/packages/locale/lang/es-ES.ts +832 -832
  59. package/packages/locale/lang/fr-FR.ts +832 -832
  60. package/packages/locale/lang/hu-HU.ts +832 -832
  61. package/packages/locale/lang/hy-AM.ts +832 -832
  62. package/packages/locale/lang/id-ID.ts +832 -832
  63. package/packages/locale/lang/it-IT.ts +832 -832
  64. package/packages/locale/lang/ja-JP.ts +832 -832
  65. package/packages/locale/lang/ko-KR.ts +832 -832
  66. package/packages/locale/lang/ms-MY.ts +832 -832
  67. package/packages/locale/lang/nb-NO.ts +832 -832
  68. package/packages/locale/lang/pt-BR.ts +832 -832
  69. package/packages/locale/lang/ru-RU.ts +832 -832
  70. package/packages/locale/lang/th-TH.ts +832 -832
  71. package/packages/locale/lang/ug-CN.ts +832 -832
  72. package/packages/locale/lang/uk-UA.ts +832 -832
  73. package/packages/locale/lang/uz-UZ.ts +832 -832
  74. package/packages/locale/lang/vi-VN.ts +832 -832
  75. package/packages/locale/lang/zh-CHT.ts +832 -832
  76. package/packages/locale/lang/zh-CN.ts +832 -832
  77. package/packages/locale/lang/zh-HK.ts +3 -3
  78. package/packages/locale/lang/zh-MO.ts +3 -3
  79. package/packages/locale/lang/zh-TC.ts +3 -3
  80. package/packages/locale/lang/zh-TW.ts +3 -3
  81. package/packages/table/index.ts +26 -26
  82. package/packages/table/module/custom/hook.ts +359 -359
  83. package/packages/table/module/custom/panel.ts +1331 -1331
  84. package/packages/table/module/edit/hook.ts +1032 -1032
  85. package/packages/table/module/export/export-panel.ts +567 -567
  86. package/packages/table/module/export/hook.ts +1654 -1654
  87. package/packages/table/module/export/import-panel.ts +266 -266
  88. package/packages/table/module/export/util.ts +24 -24
  89. package/packages/table/module/filter/hook.ts +468 -468
  90. package/packages/table/module/filter/panel.ts +301 -301
  91. package/packages/table/module/keyboard/hook.ts +495 -495
  92. package/packages/table/module/menu/hook.ts +325 -325
  93. package/packages/table/module/menu/panel.ts +201 -201
  94. package/packages/table/module/validator/hook.ts +631 -631
  95. package/packages/table/render/index.ts +1440 -1440
  96. package/packages/table/src/body.ts +932 -932
  97. package/packages/table/src/cell.ts +1290 -1290
  98. package/packages/table/src/column.ts +190 -190
  99. package/packages/table/src/columnInfo.ts +225 -225
  100. package/packages/table/src/emits.ts +123 -123
  101. package/packages/table/src/footer.ts +368 -368
  102. package/packages/table/src/group.ts +59 -59
  103. package/packages/table/src/header.ts +559 -559
  104. package/packages/table/src/props.ts +324 -324
  105. package/packages/table/src/store.ts +14 -14
  106. package/packages/table/src/table.ts +14010 -14001
  107. package/packages/table/src/use/cell-view.ts +44 -44
  108. package/packages/table/src/use/index.ts +1 -1
  109. package/packages/table/src/util.ts +1070 -1064
  110. package/packages/toolbar/index.ts +18 -18
  111. package/packages/toolbar/src/toolbar.ts +701 -701
  112. package/packages/ui/index.ts +530 -530
  113. package/packages/ui/src/anime.ts +52 -52
  114. package/packages/ui/src/comp.ts +3 -3
  115. package/packages/ui/src/dom.ts +259 -236
  116. package/packages/ui/src/log.ts +8 -8
  117. package/packages/ui/src/utils.ts +56 -56
  118. package/packages/ui/src/vn.ts +55 -55
  119. package/packages/v-x-e-table/index.d.ts +4 -4
  120. package/packages/v-x-e-table/index.ts +4 -4
  121. package/styles/all.scss +7 -7
  122. package/styles/base.scss +16 -16
  123. package/styles/components/grid.scss +89 -89
  124. package/styles/components/icon.scss +225 -225
  125. package/styles/components/old-icon.scss +715 -715
  126. package/styles/components/table-module/all.scss +6 -6
  127. package/styles/components/table-module/custom.scss +527 -527
  128. package/styles/components/table-module/export.scss +130 -130
  129. package/styles/components/table-module/filter.scss +130 -130
  130. package/styles/components/table-module/menu.scss +81 -81
  131. package/styles/components/table.scss +2679 -2679
  132. package/styles/components/toolbar.scss +119 -119
  133. package/styles/default.scss +2 -2
  134. package/styles/helpers/baseMixin.scss +95 -95
  135. package/styles/index.scss +4 -4
  136. package/styles/modules.scss +5 -5
  137. package/styles/theme/base.scss +93 -93
  138. package/styles/theme/dark.scss +49 -49
  139. package/styles/theme/light.scss +44 -44
  140. package/styles/variable.scss +43 -43
  141. package/types/all.d.ts +37 -37
  142. package/types/index.d.ts +4 -4
  143. /package/es/{iconfont.1773972993993.ttf → iconfont.1774240404046.ttf} +0 -0
  144. /package/es/{iconfont.1773972993993.woff → iconfont.1774240404046.woff} +0 -0
  145. /package/es/{iconfont.1773972993993.woff2 → iconfont.1774240404046.woff2} +0 -0
  146. /package/lib/{iconfont.1773972993993.ttf → iconfont.1774240404046.ttf} +0 -0
  147. /package/lib/{iconfont.1773972993993.woff → iconfont.1774240404046.woff} +0 -0
  148. /package/lib/{iconfont.1773972993993.woff2 → iconfont.1774240404046.woff2} +0 -0
package/README.md CHANGED
@@ -1,268 +1,268 @@
1
- # vxe-table
2
-
3
- 简体中文 | [繁體中文](README.zh-TW.md) | [English](README.en.md) | [日本語](README.ja-JP.md)
4
-
5
- [![github star](https://img.shields.io/github/stars/x-extends/vxe-table.svg)](https://github.com/x-extends/vxe-table/stargazers)
6
- [![gitee star](https://gitee.com/x-extends/vxe-table/badge/star.svg?theme=gvp)](https://gitee.com/x-extends/vxe-table/stargazers)
7
- [![gitcode star](https://gitcode.com/x-extends/vxe-table/star/badge.svg)](https://gitcode.com/x-extends/vxe-table/stargazers)
8
- [![NodeJS with Webpack](https://github.com/x-extends/vxe-table/actions/workflows/webpack.yml/badge.svg)](https://github.com/x-extends/vxe-table/actions/workflows/webpack.yml)
9
- [![npm downloads](https://img.shields.io/npm/dt/vxe-table.svg?style=flat-square)](https://npm-stat.com/charts.html?package=vxe-table)
10
- [![issues](https://img.shields.io/github/issues/x-extends/vxe-table.svg)](https://github.com/x-extends/vxe-table/issues)
11
- [![issues closed](https://img.shields.io/github/issues-closed/x-extends/vxe-table.svg)](https://github.com/x-extends/vxe-table/issues?q=is%3Aissue+is%3Aclosed)
12
- [![pull requests](https://img.shields.io/github/issues-pr/x-extends/vxe-table.svg)](https://github.com/x-extends/vxe-table/pulls)
13
- [![pull requests closed](https://img.shields.io/github/issues-pr-closed/x-extends/vxe-table.svg)](https://github.com/x-extends/vxe-table/pulls?q=is%3Apr+is%3Aclosed)
14
- [![npm license](https://img.shields.io/github/license/mashape/apistatus.svg)](LICENSE)
15
-
16
- 一个基于 [Vxe UI](https://github.com/x-extends/vxe-pc-ui) 的 PC 端表格组件,支持增删改查的可编辑表格,支持 Excel 复制粘贴、数据透视表、虚拟列表高性能的企业级表格解决方案
17
-
18
- * 设计理念
19
- * 面向现代浏览器,不支持 IE
20
- * 双向数据流的设计,在渲染器或自定义扩展中支持直接操作数据值,达到最高效的简洁 API 设计
21
- * 按需加载、自定义主题样式
22
-
23
- * 版本说明
24
- * **V4**
25
- * [ ] v4.20 功能需求收集中,大福提升渲染性能,优化百万级渲染量
26
- * [ ] v4.19 增加对增删改操作撤销回退的支持,预计发布 2026-05
27
- * [x] v4.18 内部优化,优化键盘操作
28
- * [x] v4.17 优化触摸板操作;重构筛选渲染,筛选配置更简单功能更强大
29
- * [x] v4.16 适配 Gantt 甘特图
30
- * [x] v4.15 优化虚拟渲染,降低内存的占用率
31
- * [x] v4.14 重构虚拟渲染,提高渲染与拖拽效果流畅度
32
- * [x] v4.13 优化虚拟渲染,提升 Chrome、Safari、Firefox 流畅度极兼容性
33
- * [x] v4.12 重构虚拟渲染,支持百万级数据渲染、渲染性能及流畅度大幅提升
34
- * [x] v4.11 重构展开行功能,同时支持展开行与虚拟渲染和冻结列
35
- * [x] v4.7 基于 vue3.2+,内部重构,拆分 Table 库和 UI 库,只支持现代浏览器,不支持 IE
36
- * [x] ~~v4.0 基于 vue3.2+,只支持现代浏览器,不支持 IE(2020-03-01 ~ 2024-12-01 已停止维护)~~
37
- * **V3**
38
- * [ ] v3.22 功能需求收集中,大福提升渲染性能,优化百万级渲染量
39
- * [ ] v3.21 增加对增删改操作撤销回退的支持,预计发布 2026-05
40
- * [x] v3.20 优化渲染性能,优化键盘操作
41
- * [x] v3.19 优化触摸板操作;重构筛选渲染,筛选配置更简单功能更强大
42
- * [x] v3.18 适配 Gantt 甘特图
43
- * [x] v3.17 优化虚拟渲染,降低内存的占用率
44
- * [x] v3.16 重构虚拟渲染,提高渲染与拖拽效果流畅度
45
- * [x] v3.15 优化虚拟渲染,提升 Chrome、Safari、Firefox 流畅度极兼容性
46
- * [x] v3.14 重构虚拟渲染,支持百万级数据渲染、渲染性能及流畅度大幅提升
47
- * [x] v3.13 重构展开行功能,同时支持展开行与虚拟渲染和冻结列
48
- * [x] v3.9 基于 vue2.6~2.7,内部重构,拆分 Table 库和 UI 库,只支持现代浏览器,不支持 IE
49
- * [x] ~~v3.0 基于 vue2.6~2.7,支持现代浏览器并保留兼容 IE11(2020-03-01 ~ 2024-12-01 已停止维护)~~
50
- * **V2**
51
- * [x] ~~v2.0 基于 vue2.6~2.7,支持所有主流的浏览器,同时兼具功能与性能(2019-03-01 ~ 2021-12-01 已停止维护)~~
52
- * **V1**
53
- * [x] ~~v1.0 基于 vue2.6~2.7,支持所有主流的浏览器,实现表格的一切实用的功能(2018-02-01 ~ 2020-04-01 已停止维护)~~
54
- * 版本计划
55
- * [x] 优化展开行与冻结列
56
- * [ ] 优化虚拟渲染,支持千万级数据渲染
57
- * [ ] 数据图表可视化
58
-
59
- ## 浏览器支持
60
-
61
- ![Edge](https://raw.github.com/alrra/browser-logos/master/src/edge/edge_48x48.png) | ![Chrome](https://raw.github.com/alrra/browser-logos/master/src/chrome/chrome_48x48.png) | ![Firefox](https://raw.github.com/alrra/browser-logos/master/src/firefox/firefox_48x48.png) | ![Opera](https://raw.github.com/alrra/browser-logos/master/src/opera/opera_48x48.png) | ![Safari](https://raw.github.com/alrra/browser-logos/master/src/safari/safari_48x48.png)
62
- --- | --- | --- | --- | --- |
63
- 80+ ✔ | 80+ ✔ | 90+ ✔ | 75+ ✔ | 10+ ✔ |
64
-
65
- ## 在线文档
66
-
67
- 👉 [基础库](https://vxeui.com)
68
- 👉 [表格库](https://vxetable.cn)
69
- 👉 [甘特图](https://gantt.vxeui.com)
70
- 👉 [可视化](https://design.vxeui.com)
71
-
72
- ## QQ 交流群
73
-
74
- 该群供大家交流問題,如果群人数已满,将会不定期剔除不活跃的。
75
-
76
- ![qq](https://vxeui.com/resource/donation/qq1.png)
77
- ![qq](https://vxeui.com/resource/donation/qq2.png)
78
-
79
- ## 功能点
80
-
81
- * [x] 基础表格
82
- * [x] 配置式表格
83
- * [x] 斑马线条纹
84
- * [x] 多种边框
85
- * [x] 单元格样式
86
- * [x] 列宽拖动
87
- * [x] 列拖拽排序
88
- * [x] 行拖拽排序
89
- * [x] 最小/最大高度
90
- * [x] 自适应宽高
91
- * [x] 固定列
92
- * [x] 多级表头
93
- * [x] 表尾数据
94
- * [x] 高亮行或列
95
- * [x] 序号
96
- * [x] 单选框
97
- * [x] 复选框
98
- * [x] 排序
99
- * [x] 多字段排序
100
- * [x] 筛选
101
- * [x] 合并单元格
102
- * [x] 合并表尾
103
- * [x] 行分组
104
- * [x] 导入/导出/打印
105
- * [x] 显示/隐藏列
106
- * [x] 拖拽/自定义列排序
107
- * [x] 加载中
108
- * [x] 格式化内容
109
- * [x] 自定义插槽 - 模板
110
- * [x] 快捷菜单
111
- * [x] 展开行
112
- * [x] 工具栏
113
- * [x] 虚拟树
114
- * [x] 增删改查
115
- * [x] 数据校验
116
- * [x] 数据代理
117
- * [x] 键盘导航
118
- * [x] 渲染器
119
- * [x] 虚拟滚动
120
- * [x] 虚拟合并
121
- * [x] CSS 变量主题
122
- * [x] ([企业版](https://store.vxeui.com)) 数据汇总
123
- * [x] ([企业版](https://store.vxeui.com)) 聚合函数
124
- * [x] ([企业版](https://store.vxeui.com)) 单元格区域选取
125
- * [x] ([企业版](https://store.vxeui.com)) 单元格复制/粘贴
126
- * [x] ([企业版](https://store.vxeui.com)) 单元格查找和替换
127
- * [x] ([企业版](https://store.vxeui.com)) 全键盘操作
128
- * [x] ([企业版](https://store.vxeui.com)) 集成图表
129
-
130
- ## 安装
131
-
132
- 版本:[vue](https://www.npmjs.com/package/vue) 3.x
133
-
134
- ```shell
135
- npm install vxe-table
136
- ```
137
-
138
- Get on [unpkg](https://unpkg.com/vxe-table/) and [cdnjs](https://cdn.jsdelivr.net/npm/vxe-table/)
139
-
140
-
141
- ### NPM
142
-
143
- ```javascript
144
- // ...
145
- import VxeUITable from 'vxe-table'
146
- import 'vxe-table/lib/style.css'
147
- // ...
148
-
149
- createApp(App).use(VxeUITable).mount('#app')
150
- ```
151
-
152
- ### CDN
153
-
154
- 使用第三方 CDN 方式记得锁定版本号,避免受到非兼容性更新的影响
155
- ***不建议将第三方的 CDN 地址用于正式环境,因为该连接随时都可能会失效***
156
-
157
- ```HTML
158
- <!DOCTYPE html>
159
- <html>
160
- <head>
161
- <meta charset="utf-8">
162
- <meta http-equiv="Cache-Control" content="no-cache, no-store, must-revalidate">
163
- <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
164
- <!-- style -->
165
- <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/vxe-pc-ui@4/lib/style.css">
166
- <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/vxe-table@4/lib/style.css">
167
- <!-- vue -->
168
- <script src="https://cdn.jsdelivr.net/npm/vue@3"></script>
169
- <!-- table -->
170
- <script src="https://cdn.jsdelivr.net/npm/xe-utils"></script>
171
- <script src="https://cdn.jsdelivr.net/npm/vxe-pc-ui@4"></script>
172
- <script src="https://cdn.jsdelivr.net/npm/vxe-table@4"></script>
173
- </head>
174
- <body>
175
- <div id="app">
176
- <div>
177
- <vxe-table :data="tableData">
178
- <vxe-column type="seq" title="Seq" width="60"></vxe-column>
179
- <vxe-column field="name" title="Name"></vxe-column>
180
- <vxe-column field="role" title="Role"></vxe-column>
181
- <vxe-colgroup title="Group1">
182
- <vxe-column field="sex" title="Sex"></vxe-column>
183
- <vxe-column field="address" title="Address"></vxe-column>
184
- </vxe-colgroup>
185
- </vxe-table>
186
- </div>
187
- </div>
188
- <script>
189
- (function () {
190
- var App = {
191
- data() {
192
- return {
193
- tableData: [
194
- { id: 10001, name: 'Test1', role: 'Develop', sex: 'Man', address: 'Shenzhen' },
195
- { id: 10002, name: 'Test2', role: 'Test', sex: 'Man', address: 'Guangzhou' },
196
- { id: 10003, name: 'Test3', role: 'PM', sex: 'Man', address: 'Shanghai' }
197
- ]
198
- }
199
- }
200
- }
201
- Vue.createApp(App).use(VxeUI).use(VXETable).mount('#app')
202
- })()
203
- </script>
204
- </body>
205
- </html>
206
- ```
207
-
208
- ## 示例
209
-
210
- ```html
211
- <template>
212
- <div>
213
- <vxe-table :data="tableData">
214
- <vxe-column type="seq" title="Seq" width="60"></vxe-column>
215
- <vxe-column field="name" title="Name"></vxe-column>
216
- <vxe-column field="role" title="Role"></vxe-column>
217
- <vxe-colgroup title="Group1">
218
- <vxe-column field="sex" title="Sex"></vxe-column>
219
- <vxe-column field="address" title="Address"></vxe-column>
220
- </vxe-colgroup>
221
- </vxe-table>
222
- </div>
223
- </template>
224
-
225
- <script>
226
- export default {
227
- data() {
228
- return {
229
- tableData: [
230
- { id: 10001, name: 'Test1', role: 'Develop', sex: 'Man', address: 'Shenzhen' },
231
- { id: 10002, name: 'Test2', role: 'Test', sex: 'Man', address: 'Guangzhou' },
232
- { id: 10003, name: 'Test3', role: 'PM', sex: 'Man', address: 'Shanghai' }
233
- ]
234
- }
235
- }
236
- }
237
- </script>
238
- ```
239
-
240
- ## 运行项目
241
-
242
- 安装依赖
243
-
244
- ```shell
245
- npm run update
246
- ```
247
-
248
- 启动本地调试
249
-
250
- ```shell
251
- npm run serve
252
- ```
253
-
254
- 编译打包,生成编译后的目录:es,lib
255
-
256
- ```shell
257
- npm run lib
258
- ```
259
-
260
- ## Contributors
261
-
262
- Thank you to everyone who contributed to this project.
263
-
264
- [![vxe-table](https://contrib.rocks/image?repo=x-extends/vxe-table)](https://github.com/x-extends/vxe-table/graphs/contributors)
265
-
266
- ## License
267
-
268
- [MIT](LICENSE) © 2019-present, Xu Liangzhan
1
+ # vxe-table
2
+
3
+ 简体中文 | [繁體中文](README.zh-TW.md) | [English](README.en.md) | [日本語](README.ja-JP.md)
4
+
5
+ [![github star](https://img.shields.io/github/stars/x-extends/vxe-table.svg)](https://github.com/x-extends/vxe-table/stargazers)
6
+ [![gitee star](https://gitee.com/x-extends/vxe-table/badge/star.svg?theme=gvp)](https://gitee.com/x-extends/vxe-table/stargazers)
7
+ [![gitcode star](https://gitcode.com/x-extends/vxe-table/star/badge.svg)](https://gitcode.com/x-extends/vxe-table/stargazers)
8
+ [![NodeJS with Webpack](https://github.com/x-extends/vxe-table/actions/workflows/webpack.yml/badge.svg)](https://github.com/x-extends/vxe-table/actions/workflows/webpack.yml)
9
+ [![npm downloads](https://img.shields.io/npm/dt/vxe-table.svg?style=flat-square)](https://npm-stat.com/charts.html?package=vxe-table)
10
+ [![issues](https://img.shields.io/github/issues/x-extends/vxe-table.svg)](https://github.com/x-extends/vxe-table/issues)
11
+ [![issues closed](https://img.shields.io/github/issues-closed/x-extends/vxe-table.svg)](https://github.com/x-extends/vxe-table/issues?q=is%3Aissue+is%3Aclosed)
12
+ [![pull requests](https://img.shields.io/github/issues-pr/x-extends/vxe-table.svg)](https://github.com/x-extends/vxe-table/pulls)
13
+ [![pull requests closed](https://img.shields.io/github/issues-pr-closed/x-extends/vxe-table.svg)](https://github.com/x-extends/vxe-table/pulls?q=is%3Apr+is%3Aclosed)
14
+ [![npm license](https://img.shields.io/github/license/mashape/apistatus.svg)](LICENSE)
15
+
16
+ 一个基于 [Vxe UI](https://github.com/x-extends/vxe-pc-ui) 的 PC 端表格组件,支持增删改查的可编辑表格,支持 Excel 复制粘贴、数据透视表、虚拟列表高性能的企业级表格解决方案
17
+
18
+ * 设计理念
19
+ * 面向现代浏览器,不支持 IE
20
+ * 双向数据流的设计,在渲染器或自定义扩展中支持直接操作数据值,达到最高效的简洁 API 设计
21
+ * 按需加载、自定义主题样式
22
+
23
+ * 版本说明
24
+ * **V4**
25
+ * [ ] v4.20 功能需求收集中,大福提升渲染性能,优化百万级渲染量
26
+ * [ ] v4.19 增加对增删改操作撤销回退的支持,预计发布 2026-05
27
+ * [x] v4.18 内部优化,优化键盘操作
28
+ * [x] v4.17 优化触摸板操作;重构筛选渲染,筛选配置更简单功能更强大
29
+ * [x] v4.16 适配 Gantt 甘特图
30
+ * [x] v4.15 优化虚拟渲染,降低内存的占用率
31
+ * [x] v4.14 重构虚拟渲染,提高渲染与拖拽效果流畅度
32
+ * [x] v4.13 优化虚拟渲染,提升 Chrome、Safari、Firefox 流畅度极兼容性
33
+ * [x] v4.12 重构虚拟渲染,支持百万级数据渲染、渲染性能及流畅度大幅提升
34
+ * [x] v4.11 重构展开行功能,同时支持展开行与虚拟渲染和冻结列
35
+ * [x] v4.7 基于 vue3.2+,内部重构,拆分 Table 库和 UI 库,只支持现代浏览器,不支持 IE
36
+ * [x] ~~v4.0 基于 vue3.2+,只支持现代浏览器,不支持 IE(2020-03-01 ~ 2024-12-01 已停止维护)~~
37
+ * **V3**
38
+ * [ ] v3.22 功能需求收集中,大福提升渲染性能,优化百万级渲染量
39
+ * [ ] v3.21 增加对增删改操作撤销回退的支持,预计发布 2026-05
40
+ * [x] v3.20 优化渲染性能,优化键盘操作
41
+ * [x] v3.19 优化触摸板操作;重构筛选渲染,筛选配置更简单功能更强大
42
+ * [x] v3.18 适配 Gantt 甘特图
43
+ * [x] v3.17 优化虚拟渲染,降低内存的占用率
44
+ * [x] v3.16 重构虚拟渲染,提高渲染与拖拽效果流畅度
45
+ * [x] v3.15 优化虚拟渲染,提升 Chrome、Safari、Firefox 流畅度极兼容性
46
+ * [x] v3.14 重构虚拟渲染,支持百万级数据渲染、渲染性能及流畅度大幅提升
47
+ * [x] v3.13 重构展开行功能,同时支持展开行与虚拟渲染和冻结列
48
+ * [x] v3.9 基于 vue2.6~2.7,内部重构,拆分 Table 库和 UI 库,只支持现代浏览器,不支持 IE
49
+ * [x] ~~v3.0 基于 vue2.6~2.7,支持现代浏览器并保留兼容 IE11(2020-03-01 ~ 2024-12-01 已停止维护)~~
50
+ * **V2**
51
+ * [x] ~~v2.0 基于 vue2.6~2.7,支持所有主流的浏览器,同时兼具功能与性能(2019-03-01 ~ 2021-12-01 已停止维护)~~
52
+ * **V1**
53
+ * [x] ~~v1.0 基于 vue2.6~2.7,支持所有主流的浏览器,实现表格的一切实用的功能(2018-02-01 ~ 2020-04-01 已停止维护)~~
54
+ * 版本计划
55
+ * [x] 优化展开行与冻结列
56
+ * [ ] 优化虚拟渲染,支持千万级数据渲染
57
+ * [ ] 数据图表可视化
58
+
59
+ ## 浏览器支持
60
+
61
+ ![Edge](https://raw.github.com/alrra/browser-logos/master/src/edge/edge_48x48.png) | ![Chrome](https://raw.github.com/alrra/browser-logos/master/src/chrome/chrome_48x48.png) | ![Firefox](https://raw.github.com/alrra/browser-logos/master/src/firefox/firefox_48x48.png) | ![Opera](https://raw.github.com/alrra/browser-logos/master/src/opera/opera_48x48.png) | ![Safari](https://raw.github.com/alrra/browser-logos/master/src/safari/safari_48x48.png)
62
+ --- | --- | --- | --- | --- |
63
+ 80+ ✔ | 80+ ✔ | 90+ ✔ | 75+ ✔ | 10+ ✔ |
64
+
65
+ ## 在线文档
66
+
67
+ 👉 [基础库](https://vxeui.com)
68
+ 👉 [表格库](https://vxetable.cn)
69
+ 👉 [甘特图](https://gantt.vxeui.com)
70
+ 👉 [可视化](https://design.vxeui.com)
71
+
72
+ ## QQ 交流群
73
+
74
+ 该群供大家交流問題,如果群人数已满,将会不定期剔除不活跃的。
75
+
76
+ ![qq](https://vxeui.com/resource/donation/qq1.png)
77
+ ![qq](https://vxeui.com/resource/donation/qq2.png)
78
+
79
+ ## 功能点
80
+
81
+ * [x] 基础表格
82
+ * [x] 配置式表格
83
+ * [x] 斑马线条纹
84
+ * [x] 多种边框
85
+ * [x] 单元格样式
86
+ * [x] 列宽拖动
87
+ * [x] 列拖拽排序
88
+ * [x] 行拖拽排序
89
+ * [x] 最小/最大高度
90
+ * [x] 自适应宽高
91
+ * [x] 固定列
92
+ * [x] 多级表头
93
+ * [x] 表尾数据
94
+ * [x] 高亮行或列
95
+ * [x] 序号
96
+ * [x] 单选框
97
+ * [x] 复选框
98
+ * [x] 排序
99
+ * [x] 多字段排序
100
+ * [x] 筛选
101
+ * [x] 合并单元格
102
+ * [x] 合并表尾
103
+ * [x] 行分组
104
+ * [x] 导入/导出/打印
105
+ * [x] 显示/隐藏列
106
+ * [x] 拖拽/自定义列排序
107
+ * [x] 加载中
108
+ * [x] 格式化内容
109
+ * [x] 自定义插槽 - 模板
110
+ * [x] 快捷菜单
111
+ * [x] 展开行
112
+ * [x] 工具栏
113
+ * [x] 虚拟树
114
+ * [x] 增删改查
115
+ * [x] 数据校验
116
+ * [x] 数据代理
117
+ * [x] 键盘导航
118
+ * [x] 渲染器
119
+ * [x] 虚拟滚动
120
+ * [x] 虚拟合并
121
+ * [x] CSS 变量主题
122
+ * [x] ([企业版](https://store.vxeui.com)) 数据汇总
123
+ * [x] ([企业版](https://store.vxeui.com)) 聚合函数
124
+ * [x] ([企业版](https://store.vxeui.com)) 单元格区域选取
125
+ * [x] ([企业版](https://store.vxeui.com)) 单元格复制/粘贴
126
+ * [x] ([企业版](https://store.vxeui.com)) 单元格查找和替换
127
+ * [x] ([企业版](https://store.vxeui.com)) 全键盘操作
128
+ * [x] ([企业版](https://store.vxeui.com)) 集成图表
129
+
130
+ ## 安装
131
+
132
+ 版本:[vue](https://www.npmjs.com/package/vue) 3.x
133
+
134
+ ```shell
135
+ npm install vxe-table
136
+ ```
137
+
138
+ Get on [unpkg](https://unpkg.com/vxe-table/) and [cdnjs](https://cdn.jsdelivr.net/npm/vxe-table/)
139
+
140
+
141
+ ### NPM
142
+
143
+ ```javascript
144
+ // ...
145
+ import VxeUITable from 'vxe-table'
146
+ import 'vxe-table/lib/style.css'
147
+ // ...
148
+
149
+ createApp(App).use(VxeUITable).mount('#app')
150
+ ```
151
+
152
+ ### CDN
153
+
154
+ 使用第三方 CDN 方式记得锁定版本号,避免受到非兼容性更新的影响
155
+ ***不建议将第三方的 CDN 地址用于正式环境,因为该连接随时都可能会失效***
156
+
157
+ ```HTML
158
+ <!DOCTYPE html>
159
+ <html>
160
+ <head>
161
+ <meta charset="utf-8">
162
+ <meta http-equiv="Cache-Control" content="no-cache, no-store, must-revalidate">
163
+ <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
164
+ <!-- style -->
165
+ <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/vxe-pc-ui@4/lib/style.css">
166
+ <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/vxe-table@4/lib/style.css">
167
+ <!-- vue -->
168
+ <script src="https://cdn.jsdelivr.net/npm/vue@3"></script>
169
+ <!-- table -->
170
+ <script src="https://cdn.jsdelivr.net/npm/xe-utils"></script>
171
+ <script src="https://cdn.jsdelivr.net/npm/vxe-pc-ui@4"></script>
172
+ <script src="https://cdn.jsdelivr.net/npm/vxe-table@4"></script>
173
+ </head>
174
+ <body>
175
+ <div id="app">
176
+ <div>
177
+ <vxe-table :data="tableData">
178
+ <vxe-column type="seq" title="Seq" width="60"></vxe-column>
179
+ <vxe-column field="name" title="Name"></vxe-column>
180
+ <vxe-column field="role" title="Role"></vxe-column>
181
+ <vxe-colgroup title="Group1">
182
+ <vxe-column field="sex" title="Sex"></vxe-column>
183
+ <vxe-column field="address" title="Address"></vxe-column>
184
+ </vxe-colgroup>
185
+ </vxe-table>
186
+ </div>
187
+ </div>
188
+ <script>
189
+ (function () {
190
+ var App = {
191
+ data() {
192
+ return {
193
+ tableData: [
194
+ { id: 10001, name: 'Test1', role: 'Develop', sex: 'Man', address: 'Shenzhen' },
195
+ { id: 10002, name: 'Test2', role: 'Test', sex: 'Man', address: 'Guangzhou' },
196
+ { id: 10003, name: 'Test3', role: 'PM', sex: 'Man', address: 'Shanghai' }
197
+ ]
198
+ }
199
+ }
200
+ }
201
+ Vue.createApp(App).use(VxeUI).use(VXETable).mount('#app')
202
+ })()
203
+ </script>
204
+ </body>
205
+ </html>
206
+ ```
207
+
208
+ ## 示例
209
+
210
+ ```html
211
+ <template>
212
+ <div>
213
+ <vxe-table :data="tableData">
214
+ <vxe-column type="seq" title="Seq" width="60"></vxe-column>
215
+ <vxe-column field="name" title="Name"></vxe-column>
216
+ <vxe-column field="role" title="Role"></vxe-column>
217
+ <vxe-colgroup title="Group1">
218
+ <vxe-column field="sex" title="Sex"></vxe-column>
219
+ <vxe-column field="address" title="Address"></vxe-column>
220
+ </vxe-colgroup>
221
+ </vxe-table>
222
+ </div>
223
+ </template>
224
+
225
+ <script>
226
+ export default {
227
+ data() {
228
+ return {
229
+ tableData: [
230
+ { id: 10001, name: 'Test1', role: 'Develop', sex: 'Man', address: 'Shenzhen' },
231
+ { id: 10002, name: 'Test2', role: 'Test', sex: 'Man', address: 'Guangzhou' },
232
+ { id: 10003, name: 'Test3', role: 'PM', sex: 'Man', address: 'Shanghai' }
233
+ ]
234
+ }
235
+ }
236
+ }
237
+ </script>
238
+ ```
239
+
240
+ ## 运行项目
241
+
242
+ 安装依赖
243
+
244
+ ```shell
245
+ npm run update
246
+ ```
247
+
248
+ 启动本地调试
249
+
250
+ ```shell
251
+ npm run serve
252
+ ```
253
+
254
+ 编译打包,生成编译后的目录:es,lib
255
+
256
+ ```shell
257
+ npm run lib
258
+ ```
259
+
260
+ ## Contributors
261
+
262
+ Thank you to everyone who contributed to this project.
263
+
264
+ [![vxe-table](https://contrib.rocks/image?repo=x-extends/vxe-table)](https://github.com/x-extends/vxe-table/graphs/contributors)
265
+
266
+ ## License
267
+
268
+ [MIT](LICENSE) © 2019-present, Xu Liangzhan