下载以及导入

一个打工仔的笔记

已于 2023-09-19 18:41:11 修改

阅读量90

点赞数

文章标签：前端服务器

于 2023-08-25 15:14:51 首次发布

本文链接：https://blog.csdn.net/Web_Notes/article/details/132496307

版权

1.下载
①后端写好了直接调方法

<el-button type="primary" size="mini" @click="downloadFile">下载模板</el-button>

    //下载文件
    downloadFile() {
      let url = baseUrl + "common/download/classPath?resource=/excel/";
      // let url =
      //   "http://10.100.10.54:8088/common/download/classPath?resource=/excel/";
      const fileName = "户号及用电类型统计（导入模板）.xls";
      const a = document.createElement("a");
      a.setAttribute("download", fileName);
      a.setAttribute("href", url + fileName);
      a.click();
    }

② 二进制流的格式

const downloadFile = (url, fileName) => {
  // url: 后端下载接口  fileName： 下载文件时，文件名称
  axios({
    method: 'get', // 此处不一定只是get方法，也可以通过参数传递
    url: url,
    responseType: 'blob', // 此处重点：标明后端返回数据类型为流
  }).then(res => {
    let blob = new Blob([res.data], {
      // 下载的文件类型(此处可更改：具体取值参考以下链接地址)
      type: "application/vnd.ms-excel"
    });
    let url = window.URL.createObjectURL(blob);
    let link = document.createElement('a');
    link.style.display = 'none';
    link.download = fileName
    link.href = url
    document.body.appendChild(link)
    link.click()
  }).catch(error => {
    console.log('下载文件失败')
  });
}

``