欢迎您访问程序员文章站本站旨在为大家提供分享程序员计算机编程知识!
您现在的位置是: 首页  >  IT编程

vue实现word,pdf文件的导出功能

程序员文章站 2022-06-21 08:05:27
vue实现word或pdf文档导出的功能,我的项目是:后端返回一个文档流(下图),然后前端对文档流做处理进行下载,代码如下: import axios from...

vue实现word或pdf文档导出的功能,我的项目是:后端返回一个文档流(下图),然后前端对文档流做处理进行下载,代码如下:

import axios from 'axios';
    axios.get(`url`, { //url: 接口地址
responsetype: `arraybuffer` //一定要写
})
.then(res => {
if(res.status == 200){
let blob = new blob([res.data], {
type: `application/msword` //word文档为msword,pdf文档为pdf
});
let objecturl = url.createobjecturl(blob);
let link = document.createelement("a");
let fname = `我的文档`; //下载文件的名字
link.href = objecturl;
link.setattribute("download", fname);
document.body.appendchild(link);
link.click();
}else {
this.$message({
type: "error",
message: "导出失败"
})
}
});

后端返回的文档流的格式:

pdf格式:

vue实现word,pdf文件的导出功能

word格式:

vue实现word,pdf文件的导出功能

总结

以上所述是小编给大家介绍的vue实现word,pdf文件的导出功能,希望对大家有所帮助