vue导出文件功能,如excel
//导出excel
handleExport(index, row) {
const _this = this;
let params = { //接口参数
....
}
exportBudeget(params, { responseType: 'blob' }).then(res => {
_this.$common.exportFile(_this, 'xls', res, `xxxxx.xls`)
})
}
// 导出
function exportFile(_this, fileType, res, name) {
//实例化 FileReader
const reader = new FileReader();
if (res.type === "application/json") { //判错处理
reader.readAsText(res, "utf-8");
//读取完后会获取reader.result要转化为可读取的JS对象
reader.onload = function(e) {
const { message } = JSON.parse(e.target.result);
_this.$message({
message: message,
type: "error"
});
};
} else {
//方法一: 更推荐
reader.readAsDataURL(res); //转换为base64,可以直接放入a标签href
reader.onload = e => {
const file = e.target.result;
//转换完成,创建一个a标签用于下载
let a = document.createElement("a");
a.style.display = "none";
a.download = name;
a.href = file;
const body = document.body;
body.appendChild(a); //修复firefox中无法触发click
a.click();
body.removeChild(a);
};
// 方法二:
// let type =
// "application/vnd.openxmlformats-officedocument.spreadsheetml.sheet";
// if (fileType === "xls") {
// type =
// "application/vnd.openxmlformats-officedocument.spreadsheetml.sheet";
// }
// const url = window.URL.createObjectURL(
// new Blob([res], {
// type: type
// })
// );
// const link = document.createElement("a");
// link.style.display = "none";
// link.href = url;
// //获取文件名称
// link.download = name;
// document.body.appendChild(link);
// link.click();
// URL.revokeObjectURL(link.href);
// document.body.removeChild(link);
}
}