如何巧妙运用Vue表格组件Vxe-table实现高效数据展示？

本文共计1547个文字，预计阅读时间需要7分钟。

目录+前言+1、树形结构配置：+2、获取全局table对象：+3、使用多选框注意事项：+4、编辑行或单元格注意事项：+5、表尾数据合并问题：+6、仅显示已选中功能讲解：+7、解决初始数据半自动处理

目录

• 前言
• 1、树形结构配置：
• 2、获取全局table对象：
• 3、使用多选框注意事项：
• 4、编辑行或单元格注意事项：
• 5、表尾数据合并问题：
• 6、仅显示已勾选功能讲解：
• 7、解决初始数据半选中状态失效问题：
• 补充：VXEtable展示指定行所遇到得问题
• 总结

前言

最近项目中需要用到多层树table+checkbox勾选功能，选了一些组件，最终决定使用vxe-table。

Vxe-table功能丰富、api也多。官方例子很多比较粗浅，我花了很多精力才弄通了一些功能点及细节。在此汇总给大伙铺铺路。官网：vxe-table v4，安装配置和一般组件库差不多，就不细说了。由于项目用的是vue2，所以vxe-table用的是v3版本。

1、树形结构配置：

官方配置的树是一个数组，需要在tree-config对象里设置transform为true，这样才会自动把数组转换为需要的树结构。

如果已经有一个具有树形结构的表数据，则应该设置transform为false。