vue---下载文件

下载文件的写法

MainItemAPI.downloadFileUsingPOST({
        projectid: this.projectid,
        $config: {
          responseType: 'blob'//关键，解决响应流问题
        }
      })
        .then(res => {
          const blob = new Blob([res.data], { type: 'application/vnd.openxmlformats-officedocument.spreadsheetml.sheet' })
          const disposition = res.headers["content-disposition"]
          const filenameRegex = /filename[^;=\n]*=((['"]).*?|[^;\n]*)/;
          const matches = filenameRegex.exec(disposition);
          const filename = matches[1].replace(/['"]/g, '');
          if (typeof window.navigator.msSaveBlob !== 'undefined') {
            // 兼容IE，window.navigator.msSaveBlob：以本地方式保存文件
            window.navigator.msSaveBlob(blob, decodeURI(filename))
          } else {
            // 创建新的URL并指向File对象或者Blob对象的地址
            const blobURL = window.URL.createObjectURL(blob)
            // 创建a标签，用于跳转至下载链接
            const tempLink = document.createElement('a')
            tempLink.style.display = 'none'
            tempLink.href = blobURL
            tempLink.setAttribute('download', decodeURI(filename))
            // 兼容：某些浏览器不支持HTML5的download属性
            if (typeof tempLink.download === 'undefined') {
              tempLink.setAttribute('target', '_blank')
            }
            // 挂载a标签
            document.body.appendChild(tempLink)
            tempLink.click()
            document.body.removeChild(tempLink)
            // 释放blob URL地址
            window.URL.revokeObjectURL(blobURL)
          }
          this.exportloading = false
        }).catch((error) => {
          this.exportloading = false
          this.$message.error(error.message);
        })MainItemAPI.downloadFileUsingPOST