vue js 前端同时下载多个文件，前端多文件下载

在日常需求中，一般情况下，单次点击下载文件数量一般是一个，当然也有多个文件同时下载的需求，由于浏览器机制，不支持直接多个文件下载，所有需要特殊处理

案例图

不多说了，直接上代码

 //下载文件
      downloadPapers() {
        let obj = {
          id: this.examId,
        }
 
        exportFile的接口(obj).then((res) => {
          if (res.code == 200) {
            this.$message({
              message: '下载成功！',
              type: 'success',
              duration: 2000,
            })
            res.data.forEach((file, index) => {
              this.downloadFile(
                file,
                index == 0 ? this.timestamp + '文件1' : this.timestamp + '文件2'      //相当于是一个文件自定义的名称
              )
            })
          }
        })
      },
       //阻止href多文件下载只下载一个问题方法
      downloadFile(url, filename) {
        const xhr = new XMLHttpRequest()
        xhr.open('GET', url, true)
        xhr.responseType = 'blob'
        xhr.onload = () => {
          if (xhr.status === 200) {
            const blob = xhr.response
            const link = document.createElement('a')
            link.href = window.URL.createObjectURL(blob)
            link.download = filename
            link.click()
          }
        }
        xhr.send()
      },