【猛地学】vxe-table（支持大数据量的可编辑vue表格插件）

vxe-table（支持大数据量的可编辑表格插件）

因为公司有数据量大的表格，看了一下解决方案，发现了一个好的table插件

官方文档

VXE Table 是一个基于Vue的表格框架，支持增删改查、虚拟滚动、懒加载、快捷菜单、数据校验、树形结构、打印导出、表单渲染、数据分页、虚拟列表、模态窗口、自定义模板、渲染器、贼灵活的配置项、扩展接口等。

VXE Table面向现代浏览器，高效的简洁 API 设计，模块化表格、按需加载、扩展接口，为单行编辑表格而设计，支持增删改查及更多扩展，强大的功能的同时兼具性能。

功能及特点

• 基础表格
• 高级表格
• 斑马线条纹
• 多种边框
• 单元格样式
• 列宽拖动
• 最大高度
• 自适应宽高
• 固定列
• 多级表头
• 表尾数据
• 高亮行或列
• 序号
• 单选框
• 复选框
• 下拉选项
• 开关
• 排序
• 筛选
• 合并单元格
• 合并表尾
• 导入/导出/打印
• 显示/隐藏列
• 加载中
• 格式化内容
• 自定义插槽 - 模板
• 快捷菜单
• 展开行
• 分页
• 表单
• 工具栏
• 下拉容器
• 虚拟列表
• 增删改查
• 树表格
• 数据校验
• 数据代理
• 键盘导航
• 模态窗口
• 渲染器
• 虚拟滚动
• 虚拟合并
• (pro) 单元格区域选取
• (pro) 单元格复制/粘贴
• (pro) 单元格查找和替换

优势：最大的优势是表格可编辑

其他：

1，图标多样

2，表格类型多

3，支持大数据量加载，例如实现下拉框虚拟列表、海量数据列表…等等，对性能大幅提升，滚动流畅（理论上最大可以支持 60w 行）

参考：https://blog.csdn.net/xlz26296/article/details/106732633/

4，支持层级关系复杂数据处理（树结构）

5,多功能表格 编辑、实时保存、自定义打印、导出csv、导出xlsx(导出打印这块还没有实际操作过) 参考： https://blog.csdn.net/qq_40413396/article/details/124998869

官网描述的功能：参考https://vxetable.cn/v3/#/table/start/install

基础表格、高级表格、斑马线条纹、多种边框、单元格样式、列宽拖动、最大高度、自适应宽高、

固定列、多级表头、表尾数据、高亮行、列、序号、单选框、复选框、下拉选项、开关、排序、筛选、

合并行或列、导入、导出、打印、显示/隐藏列、加载中、格式化内容、自定义插槽/模板、快捷菜单、展开行、

分页、表单、工具栏、下拉容器、虚拟列表、增删改查、树表格、数据校验、数据代理、键盘导航、模态窗口、渲染器、虚拟滚动

我遇到过的坑点：1、全局的size修改以及一些基础的样式不是很友好

参考：https://blog.csdn.net/m0_38085253/article/details/124865828

2、参数绑定，数据刷新，单元格合并加载数据会出现些小漏洞

3、插件的说明书有些地方写的不是很好，有些地方需要自己研究

4、表单校验不好使

网上提出的个别缺点：

1，启用虚拟滚动后 show-overflow，show-header-overflow，show-footer-overflow 参数将根据渲染规则各自触发生效，无法取消；所有单元格比较同等高度，不能用于自适应高度；,

2.不支持展开行以及任何更改单元格高度的方式

3，横向虚拟滚动不支持分组表头，

4，当渲染复杂固定列时，同步滚动会有延迟，具体由渲染的复杂度决定

5.按钮导入导出，样式错乱，导出pdf报错等其他问题