el-upload文件上传

前端

<el-upload
  	:auto-upload="false"
    :before-upload="beforeUpload"
    :file-list="files"
    :limit="1"
    :on-change="handleChange"
    :on-exceed="handleExceed"
    accept=".doc, .txt, .xls, .xlsx"
    ref="upload"
    action
  >
</el-upload>

files:[]

//方法
updateData(){
  let formData = new FormData();
  formData.append("xxx",this.temp.xxx);
  formData.append("uploadPic",this.files[0].raw);

  api.sys.update(formData);
}

//js
update(query){
  return request({
    url: '/xxx/xxx/xxx',
    method: 'post',
    data: query,
    headers: {
      'Content-Type': 'multipart/form-data'
    }
  })
}

后端

@PostMapping（"/xxx"）
public void update(@RequestParam(value = "uploadPic", required = false) MultipartFile file, Student student){
     	//file是一个临时文件，在一次请求完成之后该临时文件会删除，需要转存到指定位置、
        log.info(file.toString());
        
        //获取原始文件名
        String originalFilename = file.getOriginalFilename();

        //截取后缀
        String suffix = originalFilename.substring(originalFilename.lastIndexOf("."));

        //为了防止文件名重名而造成文件覆盖，使用一个uuid重新生成一个名称
        String fileName = UUID.randomUUID().toString() + suffix;
        log.info("文件名：{}",fileName);

        //创建一个目录对象，就是说basePath指定的目录中存不存在该文件夹，如果不存在，就创建之
        File dir = new File(basePath);
    	//目录不存在，需要创建
        if(!dir.exists()){
            dir.mkdirs();
        }
        try {
            //将临时文件转存到指定位置
            file.transferTo(new File(basePath + fileName));
        } catch (IOException e) {
            e.printStackTrace();
        }
}