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


Posted in Javascript onJuly 31, 2018

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文件的导出功能,希望对大家有所帮助,如果大家有任何疑问请给我留言,小编会及时回复大家的。在此也非常感谢大家对三水点靠木网站的支持!

Javascript 相关文章推荐
javascript IE中的DOM ready应用技巧
Jul 23 Javascript
jQuery的实现原理的模拟代码 -1 核心部分
Aug 01 Javascript
js中arguments,caller,callee,apply的用法小结
Jan 28 Javascript
给html超链接设置事件不使用href来完成跳
Apr 20 Javascript
JQuery控制radio选中和不选中方法总结
Apr 15 Javascript
javascript连续赋值问题
Jul 08 Javascript
jquery仿百度百科底部浮动导航特效
Aug 08 Javascript
跟我学习javascript的for循环和for...in循环
Nov 18 Javascript
jQuery on()绑定动态元素出现的问题小结
Feb 19 Javascript
JavaScript设计模式之单例模式详解
Jun 09 Javascript
JavaScript中this关键字用法实例分析
Aug 24 Javascript
详解vue身份认证管理和租户管理
May 25 Vue.js
在create-react-app中使用css modules的示例代码
Jul 31 #Javascript
详解使用create-react-app添加css modules、sasss和antd
Jul 31 #Javascript
jQuery实现点击自身以外区域关闭弹出层功能完整示例【改进版】
Jul 31 #jQuery
Vue导出页面为PDF格式的实现思路
Jul 31 #Javascript
详解微信小程序实现WebSocket心跳重连
Jul 31 #Javascript
前端axios下载excel文件(二进制)的处理方法
Jul 31 #Javascript
JS构造一个html文本内容成文件流形式发送到后台
Jul 31 #Javascript
You might like
php入门学习知识点一 PHP与MYSql连接与查询
2011/07/14 PHP
php中的strpos使用示例
2014/02/27 PHP
php+ajax实现无刷新动态加载数据技术
2015/04/28 PHP
php连接mysql数据库最简单的实现方法
2019/09/24 PHP
javascript innerHTML、outerHTML、innerText、outerText的区别
2008/11/24 Javascript
js cookies实现简单统计访问次数
2009/11/24 Javascript
jQuery实现的立体文字渐变效果
2010/05/17 Javascript
js replace 与replaceall实例用法详解
2013/08/03 Javascript
jQuery 追加元素的方法如append、prepend、before
2014/01/16 Javascript
jQuery中使用data()方法读取HTML5自定义属性data-*实例
2014/04/11 Javascript
Extjs的FileUploadField文件上传出现了两个上传按钮
2014/04/29 Javascript
浅析jQuery中调用ajax方法时在不同浏览器中遇到的问题
2014/06/11 Javascript
JS动态修改iframe高度和宽度的方法
2015/04/01 Javascript
详解使用fetch发送post请求时的参数处理
2017/04/05 Javascript
微信小程序中input标签详解及简单实例
2017/05/18 Javascript
react中fetch之cors跨域请求的实现方法
2018/03/14 Javascript
Node.js创建HTTP文件服务器的使用示例
2018/05/11 Javascript
echarts多条折线图动态分层的实现方法
2019/05/24 Javascript
微信小程序之 catalog 切换实现解析
2019/09/12 Javascript
[03:28]2014DOTA2国际邀请赛 走近EG战队天才中单Arteezy
2014/07/12 DOTA
Python的Django框架中forms表单类的使用方法详解
2016/06/21 Python
最近Python有点火? 给你7个学习它的理由!
2017/06/26 Python
Python中一行和多行import模块问题
2018/04/01 Python
对python3 中方法各种参数和返回值详解
2018/12/15 Python
python3 pygame实现接小球游戏
2019/05/14 Python
python 批量添加的button 使用同一点击事件的方法
2019/07/17 Python
美国克罗格超市在线购物:Kroger
2019/06/21 全球购物
The Body Shop美体小铺西班牙官网:天然化妆品
2019/06/21 全球购物
美国儿童服装、家具和玩具精品店:Maisonette
2019/11/24 全球购物
如何估计一张表的大小(假设该表中有1万条数据)
2016/03/27 面试题
C#的几个面试问题
2016/05/22 面试题
EJB需直接实现它的业务接口或Home接口吗,请简述理由
2016/11/23 面试题
用Java语言将一个键盘输入的数字转化成中文输出
2013/01/25 面试题
小学老师寄语大全
2014/04/04 职场文书
律师函格式范本
2015/05/27 职场文书
详解Vue的sync修饰符
2021/05/15 Vue.js