Vue使用Export2Excel导出表格数据(导出链表数据)

原创

已于 2022-06-22 16:28:47 修改 · 2.6k 阅读

6 ·

CC 4.0 BY-SA版权

文章标签：

#vue.js #前端 #javascript

于 2022-02-22 15:24:53 首次发布

本文介绍如何在Vue项目中使用Export2Excel插件，详细阐述了当表格数据涉及多表关联（链表数据）时，如何进行Excel导出的步骤，并分享了修改后的formatJson方法。

vue项目使用Export2Excel导出Excel表格详细步骤可以参考：https://www.jianshu.com

不过要是表中存在外表的数据（多表链表查询出来的数据），也想一起导出怎么办？

下面是我自己在原有的基础上修改的 formatJson() 方法：

export2Excel(){

    var that = this;

    // 这里必须使用绝对路径，使用@/+存放export2Excel的路径
  	import('@/vendor/Export2Excel').then(excel => {

        // 导出的表头名信息，也就是选中列
        const tHeader = ['ID', '用户名', '性别(0=女,1=男)', '头像', 'openID', '省份', '城
                         市', '国家', '语言', '身份', '上家id', '手机号', '余额', '积分',
                         '状态'];

        // 导出的表头字段名，需要导出表格字段名
		const filterVal = ['id', 'nickName', 'gender', 'avatarUrl', 'openid', 'province', 
                           'city', 'country', 'language', 'localIdentity.identity', 
                           'localUser.id', 'phone', 'balance', 'integral', 'status'];
        
        // 此处为你选中的数据
		const list = that.exce