Vue导出功能

   //template部分
   <el-button class="filter-item" icon="document" @click="getListExcel()">导出</el-button>
   
  //methods部分
  getListExcel() {
       //excel是向后台获取数据的方法，项目中分离出来了
       excel(this.listQuery).then(response => {
             if (response.data.code === 1) {
                  const rows = response.data.result;
                  if (rows != null){
                        this.listExcel = rows;
                        this.excelTotal = rows.length;
                        this.handleDownload(this.listExcel,this.excelTotal);
                    }
                }
        })
   },
  handleDownload(excel,excelTotal) {
        if (excelTotal > 50000) {
               this.$message({title: '警告', message: '最多只能导出50000条！', type: 'warning', duration: 2000});
               return;
         }
         require.ensure([], () => {
                const {export_json_to_excel} = require('vendor/Export2Excel');
                //tHeader是导出数据的表头
                const tHeader = ['商户编号', '商户名称', '会员编号', '注册手机', '会员名称', '授权时间', ' 类型', '授权截止时间',
                                '授权总额度(元)', '授权单次额度(元)', '剩余额度(元)', '授权状态'];
                //filterVal为表头对应的属性                
                const filterVal = ['merchantNo', 'merchantName', 'userId','userPhone', 'userName','accreditTime','accreditType',
                                'lastDate', 'accreditAmount', 'accreditAmountSingle','releaseAmount', 'status']
                const data = this.formatJson(filterVal, excel);
                //导出文件的名称
                export_json_to_excel(tHeader, data, '会员授权记录');
        })
  },
  formatJson(filterVal, jsonData) {
        return jsonData.map(v => filterVal.map(j => {
               return this.fundExcel(v, j);
        }))
   },
  //对一些数据进行处理，如时间金额等，具体看业务需求
  fundExcel(mapValue, mapKey) {
        if (mapKey === 'accreditTime') {
               if(mapValue[mapKey] != null){
               //parseTime为格式化数据的方法
                     return parseTime(mapValue[mapKey])
               }else{
                     return mapValue[mapKey];
               }
        } else if (mapKey === 'lastDate') {
               if(mapValue[mapKey] != null){
                     return parseTime(mapValue[mapKey]).substring(0,parseTime(mapValue[mapKey]).length -9)
               }else{
                     return mapValue[mapKey];
               }
        } else if (mapKey === 'userId') {
               if(mapValue[mapKey] != null){
                     return mapValue[mapKey]+''
                }else {
                     return mapValue[mapKey];
                }
        } else if (mapKey === 'accreditType') {
                if(mapValue[mapKey] == '1'){
                     return '余额支付'
                }else if(mapValue[mapKey] == '2'){
                     return '结算'
                }else {
                     return mapValue[mapKey];
                }
        } else if (mapKey === 'status') {
                if(mapValue[mapKey] != '1'){
                     return '生效中'
                }else if(mapValue[mapKey] != '0'){
                     return '已失效'
                }else {
                     return mapValue[mapKey];
                }
        } else if(mapKey === 'accreditAmount' || mapKey === 'accreditAmountSingle' || mapKey === 'releaseAmount'){
                return (Number(mapValue[mapKey]) / 100).toFixed(2);
        } else {
                return mapValue[mapKey]
        }
 },