浏览器的异步行为导致多个文件下载时没有全部执行

此处用例涉及的传参urls，是一个用","拼接的文件url字符串，如"img1.jpg,img2.jpg,img3.jpg"

downloadFile(urls) {
            // 将URL字符串分割成数组
            const urlArray = urls.split(',');

            // 定义一个递归函数来处理每个URL
            function downloadNext(index) {
                if (index >= urlArray.length) return; // 所有文件下载完毕

                const url = urlArray[index].trim(); // 去除URL前后的空格
                console.log("当前下载文件url: ", url);

                // 创建一个隐藏的<a>标签
                const tempLink = document.createElement("a");
                tempLink.style.display = "none";
                tempLink.href = url;

                // 从URL中提取文件名和扩展名
                const filename = url.substring(url.lastIndexOf('/') + 1);
                tempLink.setAttribute("download", filename);

                // 如果浏览器不支持download属性，则打开新窗口
                if (typeof tempLink.download === "undefined") {
                    tempLink.setAttribute("target", "_blank");
                }

                // 将<a>标签添加到文档中并触发点击事件
                document.body.appendChild(tempLink);
                tempLink.click();

                // 移除<a>标签
                document.body.removeChild(tempLink);

                // 使用setTimeout确保每个文件下载请求之间有间隔
                setTimeout(() => {
                    downloadNext(index + 1);
                }, 1000); // 1秒间隔，可以根据需要调整
            }

            // 开始下载第一个文件
            downloadNext(0);
        }

浏览器的异步行为导致多个文件下载时没有全部执行，当一个文件下载请求被触发后，浏览器可能需要一些时间来处理这个请求，而在这段时间内，下一个文件的下载请求可能已经被触发，导致只有一个文件被下载。

解决这个问题，可以使用异步编程技术（如setTimeout或Promise）来确保每个文件下载请求之间有足够的间隔时间。以下是使用setTimeout的解决方案：