vue+element将数据导出成excel表格

首先安装依赖包:  

 命令：①  npm install -S file-saver xlsx

            ②  npm install -D script-loader

  目的是有下面两个文件：

 温馨提示：可点击链接直接下载并在目录中新建一个文件夹，放进去即可，链接如下

        https://pan.baidu.com/s/1m_-7Mj1k70Uefk_aEPJr1Q  提取码：3hfx

下面来个小案例:

//1.首先注册一个点击事件：

 <el-button type="success" @click="exportData">导出</el-button>

//2.定义一下这个方法

exportData() { 

      //导出

      require.ensure([], () => {

       //  api.ExpoGrades此处调用接口

            api.ExpoGrades(this.courseForm.student_q,this.courseForm.course_r).then(res=>{

              console.log(res)

                res.data.forEach((item,index)=>{

                    // item.createTime = moment(item.createTime).format('YYYY/M/D')

                    item.active = item.active== true ? '是' : '否'

                    this.tableData.push(item)

                })

            const { export_json_to_excel } = require('../../Excel/Export2Excel');

            const tHeader = ['学号', '姓名', '性别', '学院', '专业', '班级','成绩','课程进度','是否激活'];

            const filterVal = ['cardId',

                                'userName',

                                'sex',

                                'college',

                                'specialty',

                                'team',

                                'score',

                                'coursePercent',

                                'active'];

            console.log(this.tableData)

            const list = this.tableData;  //把data里的tableData存到list

            const data = this.formatJson(filterVal, list);

            export_json_to_excel(tHeader, data, '成绩导出');

            })

        })     

    },

效果图：