vue+element ui 表格選中特定行導出為excel

1：使用場景：

當選中表格中某幾條數據（圖中演示的為兩行選中一行）進行導出為excel（如圖二）

2：安裝依賴：

npm install --save xlsx file-saver
npm install -D script-loader

3：引入依賴文件：

在src文件夾中創建名為excel的文件夾（注意大小寫）
將Blob.js、export2Excel.js兩個js文件復制到excel文件夾下
鏈接：https://pan.baidu.com/s/1P5qLlLrpcMxht_8RpUnZfw
提取碼：2wdf

4：表格樣式：

@selection-change="handleSelectionChange"為選中相應行時調用某個事件
:data="tableData"為表格的數據源

<el-table @selection-change="handleSelectionChange" :data="tableData">

5：在methods方法中寫一個方法監控選擇的行的情況：

handleSelectionChange (val) { // 操作多選
      this.multipleSelection = val; // 多選的行會存入multipleSelection數組中
    }

5：在methods方法中寫入列表下載的相關功能函數

// 列表下載
    downloadExcel () {
      this.$confirm('確定下載列表文件?', '提示', {
        confirmButtonText: '確定',
        cancelButtonText: '取消',
        type: 'warning'
      }).then(() => {
        this.excelData = this.multipleSelection; // multipleSelection是一個數組，存儲表格中選擇的行的數據。
        this.export2Excel();
      }).catch(() => {

      });
    },
    // 數據寫入excel
    export2Excel () {
      var that = this;
      require.ensure([], () => {
        const { export_json_to_excel } = require('@/excel/export2Excel'); // 這里必須使用絕對路徑，使用@/+存放export2Excel的路徑
        const tHeader = ['表頭名稱1', '表頭名稱2', '表頭名稱3']; // 導出的表頭名信息
        const filterVal = ['表頭字段名1', '表頭字段名2', '表頭字段名3']; // 導出的表頭字段名，需要導出表格字段名
        const list = that.excelData;
        const data = that.formatJson(filterVal, list);

        export_json_to_excel(tHeader, data, 'excel表格名字');// 導出的表格名稱，根據需要自己命名
      });
    },
    // 格式轉換，直接復制即可
    formatJson (filterVal, jsonData) {
      return jsonData.map(v => filterVal.map(j => v[j]));
    }

5：在button中引入點擊事件

<Button type="primary" @click="downloadExcel">導出</Button>

以上就可以了

參考資料：
https://blog.csdn.net/qq_26242601/article/details/91874261