批量添加：vue+easyexcel 上传excel文件解析为Java对象并保存到数据库

对于像数据库中批量添加数据，我们一般会选择通过Excel文件先按照固定的格式将数据保存，然后再通过系统上传进而保存到数据库中。

阿里的excel解析工具EasyExcel和Apach的POI都能进行Excel文件的解析，但是EasyExcel操作起来要相对更简单一些，这里我们选用VUE+EasyExcel的方式来进行数据的上传和解析。

POI解析Excel文件：https://blog.csdn.net/weixin_45890113/article/details/115742939

前端：上传Excel文件，在前端进行校验，只能上传excel文件

<div>批量上传员工信息：<label for="file-upload" class="button">选择文件</label><inputtype="file"id="file-upload"accept="application/vnd.openxmlformats-officedocument.spreadsheetml.sheet,application/vnd.ms-excel"@change="handleFileUpload"style="display: none"/>
</div>......methods: {handleFileUpload (event) {const file = event.target.files[0];if (file.type !== 'application/vnd.openxmlformats-officedocument.spreadsheetml.sheet' &&file.type !== 'application/vnd.ms-excel') {alert('只能上传 Excel 文件');return;}const formData = new FormData();formData.append('file', file);fetch(this.'上传文件的URL地址', {method: 'POST',body: formData}).then(response => {insertBatch().then(rst => {let { code, page, msg } = rst.data;if (code === '0000') {this.loading = false;this.data = rst.data.data;this.page.total = page.sum;this.page.current = page.currentPage;this.findByPage(this.page);this.page.currentSize = this.$isEmpty(this.data) ? 0 : this.data.length;} else {this.$Message.error(msg);}});}).catch(error => {console.error(error);});},
......
}......
<style>.button {display: inline-block;background-color: #42b983;color: #fff;padding: 8px 16px;border-radius: 4px;cursor: pointer;}</style>

后端：接收到前端传输的文件后，将其读取到内存中，再通过EasyExcel对其进行解析

Controller层代码

    @PostMapping("/uploadFile")public void uploadFile(MultipartFile file) {csEquipmentWbbList = csEquipmentWbbService.uploadFile(file) ;}

Service层代码

// 接口
List<CsEquipmentWbb> uploadFile(MultipartFile file);
-------------------------------------------------------------------------------------
// 实现
@Override
public List<CsEquipmentWbb> uploadFile(MultipartFile file) {EquipmentDeviceListener listener = new EquipmentDeviceListener();try {InputStream inputStream = file.getInputStream();EasyExcel.read(inputStream , EquipmentDevice.class , listener).sheet().doRead();List<CsEquipmentWbb> csEquipmentWbbList = new ArrayList<>() ;List<EquipmentDevice> equipmentDeviceList = listener.getEquipmentDeviceList() ;for (EquipmentDevice equipmentDevice : equipmentDeviceList) {CsEquipmentWbb csEquipmentWbb = beanCopyUtils.convertTo(equipmentDevice, CsEquipmentWbb.class);csEquipmentWbbList.add(csEquipmentWbb) ;}return csEquipmentWbbList ;} catch (Exception e) {log.error(e.getMessage() , e);}return null;
}

这里我们需要去创建一个listener监听器，通过继承AnalysisEventListener类并重写其中的方法来达到对Excel文件的解析。

AnalysisEventListener类的介绍：

AnalysisEventListener 是 EasyExcel 中提供的一种事件监听器，用于处理 Excel 文件的读取和写入等操作。通常情况下，我们可以通过继承 AnalysisEventListener 并重写其中的回调方法来实现对 Excel 文件的读取和写入操作。在读取 Excel 文件时，我们可以使用 AnalysisEventListener 的 invoke() 方法来获取每行数据并进行处理。同时，doAfterAllAnalysed() 方法会在 Excel 文件解析完成后被调用，我们可以在该方法中对读取到的数据进行统一处理或保存等操作。

对于EquipmentDevice类，我们需要根据自身情况去具体的设置，如果说excel文件中的数据就是刚好能符合后端接收数据的对象的属性，那么我们无需再定义一个类去接收。如果excel文件中只是包含了个别字段，那么我们最好再去定义一个新的类先将数据接收并保存，再将数据copy给指定的类的集合。

public class EquipmentDeviceListener extends AnalysisEventListener<EquipmentDevice> {List<EquipmentDevice> equipmentDeviceList = new ArrayList<>() ;public List<EquipmentDevice> getEquipmentDeviceList() {return  equipmentDeviceList;}@Overridepublic void invoke(EquipmentDevice equipmentDevice, AnalysisContext analysisContext) {equipmentDeviceList.add(equipmentDevice) ;}@Overridepublic void doAfterAllAnalysed(AnalysisContext analysisContext) {// 我们解析得到的数据也可以直接在该方法中进行进一步的处理，我是写到了service层去处理的}
}