elementUI 文件流下载文件自定义文件名

web网页精选

于 2024-05-08 17:04:07 发布

阅读量162

点赞数 3

文章标签： elementui 前端 javascript

本文链接：https://blog.csdn.net/qq_43770056/article/details/138578887

版权

    handleExport() {
      this.$confirm('确认导出文件?', '提示', {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'warning'
      }).then(() => {
        const loading = this.$loading({
          lock: true,
          text: '正在下载',
          spinner: 'el-icon-loading',
          background: 'rgba(0, 0, 0, 0.7)'
        });
        getExportExcel({ id: this.id, year: this.year }).then(res => {
          const blob = new Blob([res], { type: res.type });
          // 检查this.year是否为null
          const yearPart = this.year ? `${this.year}` : ``;
          // 构建文件名
          const fileName = `${this.staffName}${yearPart}培训记录.xlsx`;
          // 使用隐藏的a标签来触发下载
          const downloadLink = document.createElement('a');
          downloadLink.href = window.URL.createObjectURL(blob);
          downloadLink.download = fileName;
          downloadLink.style.display = 'none';
          document.body.appendChild(downloadLink);
          downloadLink.click();
          // 清理
          window.URL.revokeObjectURL(downloadLink.href);
          document.body.removeChild(downloadLink);
          loading.close();
        });
      }).catch(() => {
        loading.close();
        this.$message.error('下载请求错误');
      });
    },