导出easyExcel（前端vue2/后端springboot）

本来我是不想写这篇博文的，随着我技术的上升，已经很少有东西恶心我了，百度什么都能出来，但是百度出来的都是不能直接用的，所以我手写出来供我下次使用

后端

maven如下

<dependency> 	<groupId>com.alibaba</groupId> 	<artifactId>easyexcel</artifactId> 	<version>2.2.8</version> </dependency> 

实体类

 @Data @TableName("sys_logininfor") @ExcelIgnoreUnannotated public class SysLogininfor implements Serializable {     private static final long serialVersionUID = 1L;      /**      * ID      */     @ExcelProperty(value = "序号")     @TableId(value = "info_id", type= IdType.AUTO)     private Long infoId;       /**      * 登录状态 0成功 1失败      */     @ExcelProperty(value = "登录状态", converter = ExcelDictConvert.class)     @ExcelDictFormat(dictType = "sys_common_status")     private String status;      /**      * 登录IP地址      */     @ExcelIgnore     private String ipaddr;        /**      * 提示消息      */     @ExcelProperty(value = "提示消息")     private String msg;       /**      * 请求参数      */     @TableField(exist = false)     private Map<String, Object> params = new HashMap<>();  }  

util 工具类

//导出接口     public static <T> void export(HttpServletResponse response, Class<T> clazz, List<T> data, String fileName, String sheetName){         response.setContentType("application/vnd.ms-excel");         response.setCharacterEncoding("utf-8");         try{            fileName= new String((fileName + ExcelTypeEnum.XLSX.getValue()).getBytes(), StandardCharsets.ISO_8859_1);             response.setHeader("Content-Disposition", "attachment; filename="+fileName);             EasyExcelFactory.write(response.getOutputStream()).head(clazz).registerWriteHandler(new ExcelWidthStyleStrategy())                 .excelType(ExcelTypeEnum.XLSX)                 .sheet(sheetName).doWrite(data);         }catch(IOException e){             log.error("export excel error:",e);         }     }  

controller 接口

    @PostMapping("/export")     void export(JsonObject param,HttpServletResponse response){         List<SysLogininfor> list = new ArrayList<>();         String dateFormat = new DateTime().toString("yyyyMMddHHmmss");         String fileName =dateFormat +"统计";         export(response, SysLogininfor.class,list,fileName,"sheet1");     } 

前端：

js引入接口

export function export(data) { 	return request({ 		url: "/export", 		method: post, 		data: data, 		responseType:'arraybuffer' , 	}) } 

vue调用

  this.loading=true export({   params: {   } }).then(response => {   // 请求成功返回后，获取到Excel文件的二进制数据   const blob = new Blob([response.data], { type: 'application/vnd.ms-excel' });   // 创建下载链接   const downloadUrl = URL.createObjectURL(blob);   // 创建一个隐藏的a标签，设置下载链接和文件名，模拟点击下载   const link = document.createElement('a');   link.style.display = 'none';   link.href = downloadUrl;   link.download = '统计.xlsx';   document.body.appendChild(link);   link.click();   document.body.removeChild(link);   this.loading=false }).catch(error => {   // 请求失败处理   console.error(error); });