前端实现导出CSV

242 阅读1分钟

安装

npm install --save csv-exportor

引用

import CsvExportor from "csv-exportor";

使用

<el-button  v-if="role == 'ADMIN'" @click="exportCSV" round type="info" style="margin: 10px 2px 15px 50px">
          CSV下载
</el-button>
    exportCSV() {
    //这里定义头,并加到数组中
      let headers = ["病人姓名", "医生姓名", "result"];
      const data = [];
      data.push(headers);
      let i = 0;
      //这里是数据,循环遍历list数据添加到data中即可,i为个人业务需求可以忽略
      this.recordDetail.result.forEach(item => {
        const result = item
        let row
        if (i == 0) {
        //根据顺序添加 每一列的数据即可
          row = [this.caseInfo.patient, this.caseInfo.doctorName, result]
        } else {
          row = ['', '', result]
        }
        i++;
        data.push(row);
      })
      //导出
      CsvExportor.downloadCsv(data, { headers }, this.caseInfo.patient+".csv");
    }