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 贪吃蛇实现代码
Nov 22 Javascript
数组Array进行原型prototype扩展后带来的for in遍历问题
Feb 07 Javascript
jquery ajax 同步异步的执行示例代码
Jun 23 Javascript
js中判断控件是否存在
Aug 25 Javascript
JavaScript中的style.display属性操作
Mar 27 Javascript
JS保留两位小数,多位小数的示例代码
Jan 07 Javascript
加随机数引入脚本不让浏览器读取缓存
Sep 04 Javascript
JavaScript登录验证码的实现
Oct 27 Javascript
javascript 动态生成css代码的两种方法
Mar 17 Javascript
vue.js整合vux中的上拉加载下拉刷新实例教程
Jan 09 Javascript
vue+webpack实现异步组件加载的方法
Feb 03 Javascript
详解Vue串联过滤器的使用场景
Apr 30 Javascript
在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下用rmdir实现删除目录的三种方法小结
2008/04/20 PHP
php时间戳转换的示例
2014/03/31 PHP
字符串长度函数strlen和mb_strlen的区别示例介绍
2014/09/09 PHP
遍历echsop的region表形成缓存的程序实例代码
2016/11/01 PHP
php获取手机端的号码以及ip地址实例代码
2018/09/12 PHP
Nigma vs Alliance BO5 第二场2.14
2021/03/10 DOTA
XHTML-Strict 内允许出现的标签
2006/12/11 Javascript
关于jquery css的使用介绍
2013/04/18 Javascript
使用delegate方法为一个tr标签加一个链接
2014/06/27 Javascript
jQuery中DOM树操作之复制元素的方法
2015/01/23 Javascript
js实现文本框支持加减运算的方法
2015/08/19 Javascript
js选项卡的制作方法
2017/01/23 Javascript
原生JS中slice()方法和splice()区别
2017/03/06 Javascript
vue-scroller记录滚动位置的示例代码
2018/01/17 Javascript
详解适配器在JavaScript中的体现
2018/09/28 Javascript
Node.js JSON模块用法实例分析
2019/01/04 Javascript
vue项目中openlayers绘制行政区划
2020/12/24 Vue.js
[00:37]2016完美“圣”典风云人物:AMS宣传片
2016/12/06 DOTA
Python转换HTML到Text纯文本的方法
2015/01/15 Python
高效测试用例组织算法pairwise之Python实现方法
2017/07/19 Python
利用Pandas读取文件路径或文件名称包含中文的csv文件方法
2018/07/04 Python
python2.7实现邮件发送功能
2018/12/12 Python
python tkinter库实现气泡屏保和锁屏
2019/07/29 Python
通过实例解析Python调用json模块
2019/12/11 Python
Pycharm激活方法及详细教程(详细且实用)
2020/05/12 Python
利用CSS3 动画 绘画 圆形动态时钟
2018/03/20 HTML / CSS
《动手做做看》教学反思
2014/04/09 职场文书
2014年党支部学习材料
2014/05/19 职场文书
小城镇建设汇报材料
2014/08/16 职场文书
联谊活动总结
2014/08/28 职场文书
纪念九一八事变演讲稿:忘记意味着背叛
2014/09/14 职场文书
英文慰问信
2015/02/14 职场文书
个人向公司借款协议书
2016/03/19 职场文书
如何用JavaScript实现一个数组惰性求值库
2021/05/05 Javascript
使用 CSS 轻松实现一些高频出现的奇形怪状按钮
2021/12/06 HTML / CSS
分享一个vue实现的记事本功能案例
2022/04/11 Vue.js