循环遍历文件URL数组并使用React下载每个文件URL

时间:2017-05-02 23:50:03

标签: javascript arrays reactjs download

我正在努力做我认为'这将是一项简单的任务。我有一系列网址,当用户点击按钮时,我想循环并下载到客户端计算机。

现在我有一个父组件,其中包含按钮和我想循环并下载的url(状态)数组。出于某种原因,我现在这样做只会下载其中一个文件,而不是下载数组的所有内容。

知道如何在React中正确执行此操作吗?

handleDownload(event){
        var downloadUrls = this.state.downloadUrls;
        downloadUrls.forEach(function (value) {
            console.log('yo '+value)
        const response = {
              file: value,
        };                
            window.location.href = response.file;

        })
    }

1 个答案:

答案 0 :(得分:2)

我会使用setTimeout在下载每个文件之间稍等一下。

handleDownload(event){
    var downloadUrls = this.state.downloadUrls.slice();
    downloadUrls.forEach(function (value, idx) {
        const response = {
          file: value,
        };
        setTimeout(() => {
            window.location.href = response.file;
        }, idx * 100)
    })
}

在Chrome中,这也会提示要求下载多个文件的权限。