问题:
点击下载按钮,用a标签的download属性,会在当前页直接打开图片

使用base64转换也还是如此

最后用了blob转换,问题解决

  <el-button type="text" size="small"
   v-if="scope.row[fileDataName[0]]"
    @click="onUpLoad(scope.row.fileUrl, scope.row)">
    下载
    </el-button>
 /** 下载文件 */
    async onUpLoad(callback, file) {
      let url = file.fileUrl
      let data = await fetch(url)
        .then(response => response.blob())
        .then(res => {
          console.log(res, '==============')
          let blod = new Blob([res])
          let name = file.realName
          this.downloadBlob(blod, name)
        })
      return data
    },

在这里插入图片描述

 downloadBlob(blob, fileName) {
      try {
        const href = window.URL.createObjectURL(blob) //创建下载的链接
        if (window.navigator.msSaveBlob) {
          window.navigator.msSaveBlob(blob, fileName)
        } else {       
          const downloadElement = document.createElement('a')
          downloadElement.href = href
          downloadElement.target = '_blank'
          downloadElement.download = fileName
          document.body.appendChild(downloadElement)
          downloadElement.click() // 点击下载
          document.body.removeChild(downloadElement) // 下载完成移除元素
          window.URL.revokeObjectURL(href) // 释放掉blob对象
        }
      } catch (e) {
        console.log('下载失败')
      }
    },
Logo

前往低代码交流专区

更多推荐