导入导出文件

导出

controller层导出

@GetMapping("/export")
public void export(HttpServletRequest request, HttpServletResponse response){

    JSONObject data = new JSONObject();
    data.set("id", "id");
    data.set("data", "data");

    byte[] dataBytes =  data.toString().getBytes();

    String encoding = "UTF-8";
    OutputStream os = null;
    try{
        response.setContentType("application/octet-stream;charset=" + encoding);
        response.setCharacterEncoding(encoding);
        response.setHeader("Content-disposition", "attachment;filename="+ URLEncoder.encode("DATA", encoding));

        os = response.getOutputStream();
        os.write(dataBytes, 0, dataBytes.length);
        os.flush();
    }catch(IOException e){
        e.printStackTrace();
    }finally{
        if(os != null){
            try{
                os.close();
            }catch(IOException e){}
        }
    }
}

前端

commonDownload(content,filename){
  const blob = new Blob([content]);
  const link = document.createElement('a');
  if (link.download !== undefined) { // 支持下载属性
    const url = URL.createObjectURL(blob);
    link.setAttribute('href', url);
    link.setAttribute('download', filename);
    link.style.visibility = 'hidden';
    document.body.appendChild(link);
    link.click();
    document.body.removeChild(link);
  }
}

---

导入

前端导入

<el-upload
           ref="uploadRef"
           :auto-upload="false"
           :show-file-list="false"
           :on-change="handleChangeFile">
		<el-button type="primary">导入</el-button>
</el-upload>

methods方法

handleChangeFile (file) {
  const formData = new FormData();
  formData.append('file', file.raw);
  fielImport(formData).then(response => {
    useMessage().success("上传成功");
    this.refreshChange();
  });
},
  
export function fielImport(obj) {
  return request({
    url: '/admin/fileImport',
    method: 'post',
    data: obj,
    contentType: 'multipart/form-data'
  })
}

controller层导入

@PostMapping("/import")
public R versionControlImport(@RequestParam MultipartFile file) throws IOException {
    byte []requestByte = file.getBytes();
    String requestData = new String(requestByte);
    

    return R.ok();
}

###当感觉el-upload影响格式时，还可以将el-upload样式隐藏，通过其他按钮点击调用el-upload

handleImport(){
  this.$refs.uploadRef.$el.querySelector('input[type="file"]').click();
}