前端文件上传下载功能

业务需求：用户可以选择本地excel文件批量导入数据；

用户先通过网页下载文件模板，然后根据模板填写相关数据，然后选择文件实现数据批量导入

功能一：

下载文件模板（通过a标签href属性下载文件）：

先设置响应类型responseType：

//downloadTemplateFile为下载请求接口

downloadTemplateFile().then(res=>{

  var blob=URL.createObjectURL(res.data)//res.data直接就是返回的文件流

  var oA = document.createElement('a');

  oA.href = blob;

  oA.download = '模板文件.xlsx';//定义好文件名称还有格式后缀

  oA.click();

}).catch((err)=>{

})

 

 

导入（上传）文件功能（通过new FormData）异步请求上传:

将接口规定的参数通过append方法添加进去，如果不确定参数是否在formdata里面 可以通过get(属性名)获取，直接打印对象是看不到东西的

通过input 或者其他上传组件拿到这些文件数据                                                                                                      

然后就是调用后台接口，返回操作状态去提示用户

 

只是上传文件也可以直接通过form 的action=“接口地址” 直接上传

 

 

转载：https://blog.csdn.net/m0_37697423/article/details/102571807