ElementUI 上传文件前后端代码

前端代码如下:

importExcelBtn : function(){
          if(this.dialogImportExcel.fileList==null || this.dialogImportExcel.fileList.length==0){
          this.$message.error('文件必须上传');
          return
        }
         //var querystring = require('querystring') //原来用querystring 这种形式传值
        //var param = {}
        //this.importExcel(querystring.stringify(param))//后台捕获不到文件数据
          const multiForm = new FormData()//构建 FormData对象
          if (this.dialogImportExcel.fileList !== null && this.dialogImportExcel.fileList.length > 0) {
            this.dialogImportExcel.fileList.forEach(file => {
                    multiForm.append('files', file);
                  });
          }
          multiForm.append('isClear', this.dialogImportExcel.isClear)
          let loadingInstance = this.$loading({
            lock: true,
            background: "rgba(0, 0, 0, 0.7)",
            text: "正在导入数据,请不要刷新或关闭页面",
          });
          this.importExcel(multiForm)
                  .then(resp => {
                    this.$message({
                      type: 'success',
                      message: '导入数据成功!'
                    });
                    this.dialogImportExcelVisible = false;
                    this.getSysConfig();
                    loadingInstance.close();//关闭loading
                  }).catch(() => {
                    loadingInstance.close();//关闭loading       
                  });
        },

后端代码如下:

@PostMapping(value = "/importExcel")
    public Response<String> importExcel( HttpServletRequest request,@RequestParam(value = "isClear", required = false) String isClear,
                                            @RequestParam(value = "files", required = false) List<MultipartFile> files) {
        long start=System.currentTimeMillis();
        try {
            synchronized (this) {

                if (files.size()>0) {
                    MultipartFile multipartFile = files.get(0);
                    InputStream inputStream =  multipartFile.getInputStream();;
                    try {
                        List<EntityVo> list =         EasyExcel.read(inputStream).head(EntityVo.class).sheet().doReadSync();
                        List<Entity> dataslist=new ArrayList<>();
                        if(list!=null&&list.size()>0){
                            业务处理对应的数据
                        }else {
                            return Response.error("请导数有数据的excel。");
                        }

                    } finally {
                        try {
                            if (inputStream != null) {
                                inputStream.close();
                            }
                        } catch (IOException e) {
                            e.printStackTrace();
                        }
                    }

                }
            }
            System.out.println("运行时间:"+(System.currentTimeMillis()-start));
            return Response.ok("保存成功");
        } catch (Exception e) {
            e.printStackTrace();
            return Response.error("上传失败");
        }
    }

实体类

@Data
public class EntityVo{
    @ExcelProperty(value = "姓名", index = 0)
    private String A1;
    @ExcelProperty(value = "性别", index = 1)
    private String A2;
    @ExcelProperty(value = "年龄", index = 2)
    private String A3;
    @ExcelProperty(value = "爱好", index = 3)
    private String A4;
    @ExcelProperty(value = "颜色", index = 4)
    private String A5;
    @ExcelProperty(value = "介绍", index = 5)
    private String A6;
}
posted @ 2024-12-02 16:44  小海葵  阅读(8)  评论(0编辑  收藏  举报