Hi，大家好，我是编程小6，很荣幸遇见你，我把这些年在开发过程中遇到的问题或想法写出来，今天说一说vue 前端导出Excel[亲测有效],希望能够帮助你!!!。

1. 安装所需的依赖

npm install -S file-saver xlsx (-S => 是--save 的简写 )
npm install -D script-loader (-D => 是 --save-dev 的简写)

2. 创建Export2Excel和blob文件

具体在项目src目录下新建一个Excel的文件夹，并分别下载Blob.js和Export2Excel.js文件

这里附上这两个文件的github下载路径：Blob.js和Export2Excel.js

3. 项目实战
先导入 import { exportJsonToExcel } from ‘@/Excel/Export2Excel’ 这里我重命名了原方法名，
原方法名为：export_json_to_excel, 因为在vue代码中使用的问题，我稍微修改了下

exportDataToExcel() { 
   
  const list = this.tableSelections // 把要导出的数据tableData存到list
  if (list.length > 0) { 
   
    // let table = this.$refs.itemDetailTable
    const tHeader = ['学号', '姓名', '科目', '成绩'] // 列头名称
    const filterVal = ['schoolNum', 'name', 'category', 'score'] // 列头字段
    // table.columns.forEach((column, index) => { 
   
    // if (column.property) { 
   
    // tHeader.push(column.label)
    // filterVal.push(column.property)
    // }
    // })
    const data = this.formatJson(filterVal, list)
    exportJsonToExcel(tHeader, data, '学生成绩excel') // 定义导出的excle名字
  } else { 
   
    this.$Message('请先选择数据')
  }
},
// 格式化json数据
formatJson(filterVal, jsonData) { 
   
  return jsonData.map(v => filterVal.map(j => v[j]))
}

// 代码中注释的部分是因为导出的数据重复，多push了一遍