【VUE】点击按钮下载全部链接文件

一.VUE，点击下载全部文件按钮，将多个链接直接下载

// 按钮
<el-button type="info" @click="downloadAllUrls">下载全部文件</el-button>
// 方法，在methods中写方法
 methods: {
	async downloadAllUrls(){
	let tableData = ['http://123','http://123','http://123'];
      for (let link of tableData) {
        await this.downloadFile(link);
      }
    },
    async downloadFile(url) {
      const response = await fetch(url);
      const blob = await response.blob();
      const urlObject = window.URL.createObjectURL(blob);
      const link = document.createElement('a');
      link.href = urlObject;
      link.setAttribute('download', url.substring(url.lastIndexOf('/') + 1));
      document.body.appendChild(link);
      link.click();
      document.body.removeChild(link);
    }
}

二.单个文件下载直接用a标签

// 打开一个新窗口
<a style="color:blue;text-decoration:underline;" :href="scope.row.url" target="_blank" class="buttonText">{{url}}</a>

三.其他信息记录

1. 在原先窗口打开整个页面：

	document.write(response.data);

2. 另起一个窗口打开页面

// 在获取到response.data后
// 使用window.open()方法重新打开一个新窗口并显示response.data的内容
var newWindow = window.open();
newWindow.document.write(response.data);