前端下载文件流（可暂停、取消、查看进度）

  <el-button type="primary" icon="Download" plain @click="handleDownload('batch')">下载</el-button>

1、a标签下载（没有进度条，接口走完前端才有反应，下载大文件时用户体验不好，适用下载小文件）

// 下载
const handleDownload = async row => {
    if (selectedData.value && selectedData.value.length != 0) {
      selectedData.value.forEach(item=>{
        downloadFileAuthentication(item.propertyId).then(res => {
          downloadFileHref(item.propertyId).then(res => {
            const blob = new Blob([res], { type: 'application/zip' })
            const link = document.createElement('a')//创建a标签
            link.download = item.propertyName//a标签添加属性
            link.style.display = 'none'
            link.href = URL.createObjectURL(blob)
            document.body.appendChild(link)
            link.click()//执行下载
            URL.revokeObjectURL(link.href) //释放url
            document.body.removeChild(link)//释放标签
          })
        })
      })
      
    } else {
      ElMessage.warning('请先选择操作数据');
    }
}

2、 window.location.href下载（有进度条，可取消、暂停。缺点：一次只能下载一条，不支持批量下载）（这里后端get请求方式传参）

const handleDownload = async row => {
  const url = `/ca/download/downloadFile?propertyId=${row.propertyId}`;
  downloadFileAuthentication(row.propertyId).then(res => {
    if (res.code == 200) {
      window.location.href = ` ${downLoadUrl + url}&token=${getToken()}`
    }
  })
};

3、iframe下载（有进度条，可取消、暂停，支持同时下载多个）

const handleDownload = async row => {
    if (selectedData.value && selectedData.value.length != 0) {
      selectedData.value.forEach(item=>{
        downloadFileAuthentication(item.propertyId).then(res => {
          downloadFileHref(item.propertyId).then(res => {
       		var url = `/ca/download/downloadFile?propertyId=${item.propertyId}`;  // 文件地址
	          var iframe = document.createElement('iframe')
	          iframe.src = ` ${downLoadUrl + url}&token=${getToken()}`
	          iframe.style.display = 'none'
	          iframe.onload = function () {
	            document.body.removeAttribute(iframe)
	          }
	          document.body.appendChild(iframe)
          })
        })
      })
      
    } else {
      ElMessage.warning('请先选择操作数据');
    }
}