用iframe实现一次下载多个文件

背景

今天项目加了个新需求，要点击一个按钮下载所有模板文件。
所有模板文件都是用文件路径直接下载，原来用创建a标签打开新页面的方式实现单个文件下载，现在要多个文件一起下载，这种方法就行不通了。

a标签下载方法

downloadTemplate(key) {
    // key是文件名称
  const form = document.getElementById('download-form');
  form.action = window.TEMPLATE_MAP[key]; // 打开 【项目地址 + 文件名】的路径
  form.target = '_blank';
  form.submit();
},

a标签方法实现单个文件下载好使。

iframe下载方法

downloadTemplate(key) {
  const elemIF = document.createElement('iframe');
  elemIF.src = window.NODE_CONFIG[key];
  elemIF.style.display = 'none'; // 隐藏
  document.body.appendChild(elemIF);
},

iframe可实现单个文件和多个文件下载，并且无需打开新页面，只会有一次系统提示