【vue工作随笔】前端配合后端进行文件下载的方法记录，web前端入门宝典

作者 : admin 本文共695个字，预计阅读时间需要2分钟发布时间： 2024-04-5 共1人阅读

语法：window.open([URL], [窗口名称], [参数字符串])

wendow.open如果里面放入的是文件，肯定是会下载文件的

【vue工作随笔】前端配合后端进行文件下载的方法记录，web前端入门宝典插图

// 导入模块-下载模板

downloadTemplate(type) {

getTemplate(type).then((res) => {

console.log(res.data, “================”);

window.open(res.data.url, “_blank”);

});

实现效果：在页面下端下载文件，但是！！！文件名无法修改！！！

【vue工作随笔】前端配合后端进行文件下载的方法记录，web前端入门宝典插图(1)

// window.open(res.data.url, “_blank”);

// 方法2

const url = res.data.url;

const blob = new Blob([url], {

type: “application/vnd.openxmlformats-officedocument.spreadsheetml.sheet;charset-UTF-8”,});

const blobUrl = URL.createObjectURL(blob);

const downloadElement = document.createElement(“a”);

console.log(downloadElement);

downloadElement.style.display = “none”;

downloadElement.target = “_blank”;

downloadElement.href = blobUrl;

downloadElement.download = “模板.xlsx”;

分享到：

E-->