当前位置：首页 > news >正文

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

news 来源：原创 2024/9/20 5:38:24

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

后端

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地址*/@ExcelIgnoreprivate 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);
});