vue中使用axios处理post方法导出excel表格

vue中使用axios处理post方法导出excel表格。

技术点：vue、axios、poi

1、后台输出数据流。（ps：因为表格模板格式会比较好看，所以建议使用模板）

    /**
     * 导出测试
     * @return 输出流
     */
    @RequestMapping(value = "exportExcel.do")
    @ResponseBody
    public void exportExcel(HttpServletResponse response) {
        InputStream in = null;
        OutputStream out = null;
        HSSFWorkbook wb = null;
        try {
            //读取模板
            in = this.getClass().getResourceAsStream("/static/excel/test.xls");
            wb = new HSSFWorkbook(in);
            //设置表格内容样式
            HSSFCellStyle cellStyle = wb.createCellStyle();
            cellStyle.setBorderBottom(HSSFCellStyle.BORDER_THIN);
            cellStyle.setBorderTop(HSSFCellStyle.BORDER_THIN);
            cellStyle.setBorderRight(HSSFCellStyle.BORDER_THIN);
            cellStyle.setBorderLeft(HSSFCellStyle.BORDER_THIN);
            //垂直、水平居中
            cellStyle.setAlignment(HSSFCellStyle.ALIGN_CENTER); // 水平居中
            cellStyle.setVerticalAlignment(HSSFCellStyle.VERTICAL_CENTER); // 上下居中
            //写入对象
            Sheet sheet = wb.getSheetAt(0);
            Row row = sheet.createRow(1);    //创建第一行
            row.setHeight((short) 500);
            Cell cell0 = row.createCell(0);
            cell0.setCellStyle(cellStyle);
            cell0.setCellValue("测试数据");
            //输出
            out = response.getOutputStream();
            wb.write(out);
        } catch (Exception e) {
            logger.error("exception",e);
        } finally {
            try {
                if(!ObjectUtils.isEmpty(in)){
                    in.close();
                }
                if(!ObjectUtils.isEmpty(out)){
                    out.close();
                }
                if(!ObjectUtils.isEmpty(wb)){
                    wb.close();
                }
            } catch (IOException e) {
                e.printStackTrace();
            }
        }
    }

2、axios post方法，使用es6 promise封装。

    exportExcel(url,data){
      return new Promise((resolve, reject) => {
        axios({
          method: 'post',
          url: this.$publicPath + this.$serverName + url, // 请求地址
          data: data, // 参数
          responseType: 'blob', // 表明返回服务器返回的数据类型
          headers: {
            'Content-Type': 'application/json'
          }
        }).then(res => {
          resolve(res.data);
        }).catch(err => {
          reject(err);
        });
      })
    },

3、导出js

       /**
       * 导出Excel
       * @param
       */
      exportScheduleExcel(){
        let that = this;
        //调用方法
        that.exportExcel('testController/exportExcel.do',data).then(result =>{
          let blob = new Blob([result]);
          let fileName = '项目进度明细表.xls';
          let eLink = document.createElement('a');
          eLink.download = fileName;
          eLink.style.display = 'none';
          eLink.href = URL.createObjectURL(blob);
          document.body.appendChild(eLink);
          eLink.click();
          URL.revokeObjectURL(eLink.href); // 释放URL 对象
          document.body.removeChild(eLink);
        }).catch(err =>{
          that.$message.error(err.message);
        });
      }