这个情况首先会出现 这个提示 ,点击否 就直接退出 ,点击是 会出现另一个错误提示
发现的问题,这份 axios 请求 缺少一个注解,需要将下面注释的 responseType:'blob' 加入request 中,加入后下载下来的 excel 文件正常打开
// 导出用券列表
export function exportTicket(data) {
return request({
responseType: "blob",
url: "/courtesycardlog/export",
method: "post",
data,
});
}
// responseType: "blob",
补充:
对应的导出方法,导出 成功或失败 的提示信息需要引入 element-ui 如果没有引入,删掉即可
handleExport() {
this.$confirm("是否确定导出?", "提示", {
confirmButtonText: "确定",
cancelButtonText: "取消",
type: "info",
})
.then(() => {
if (this.list.length) {
// 这里填写接口及参数
exportTerminalnode(this.queryParams).then((res) => {
let blob = new Blob([res], {
type: "application/vnd.openxmlformats-officedocument.spreadsheetml.sheet;charset=utf-8",
}); //type这里表示xlsx类型
let downloadElement = document.createElement("a");
let href = window.URL.createObjectURL(blob); //创建下载的链接
downloadElement.href = href;
let time = new Date().toLocaleString();
// 记得更改导出时 excel 的 title
downloadElement.download = ("门店信息" + time + ".xlsx").replace(
new RegExp("/", "g"),
"-"
); //下载后文件名
document.body.appendChild(downloadElement);
downloadElement.click(); //点击下载
document.body.removeChild(downloadElement); //下载完成移除元素
window.URL.revokeObjectURL(href); //释放掉blob对象
this.$message({ type: "success", message: "下载成功" });
});
} else {
this.$message({ type: "warning", message: "暂无数据" });
}
})
.catch(() => {
this.$message("取消导出");
});
},