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 19 Javascript
js返回上一页并刷新代码整理
Dec 21 Javascript
jQuery使用andSelf()来包含之前的选择集
May 19 Javascript
JS实现的仿淘宝交易倒计时效果
Nov 27 Javascript
JSON字符串转换JSONObject和JSONArray的方法
Jun 03 Javascript
Jquery组件easyUi实现手风琴(折叠面板)示例
Aug 23 Javascript
BootStrap使用file-input插件上传图片的方法
Sep 05 Javascript
Angular学习笔记之angular的$filter服务浅析
Nov 12 Javascript
js实现百度登录框鼠标拖拽效果
Mar 07 Javascript
解析Json字符串的三种方法日常常用
May 02 Javascript
vue实现点击按钮“查看详情”弹窗展示详情列表操作
Sep 09 Javascript
JS 4个超级实用的小技巧 提升开发效率
Oct 05 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+mysql留言本源码
2009/11/11 PHP
ThinkPHP页面跳转success与error方法概述
2014/06/25 PHP
PHP使用PDO连接ACCESS数据库
2015/03/05 PHP
Discuz不使用插件实现简单的打赏功能
2019/03/21 PHP
使用laravel和ECharts实现折线图效果的例子
2019/10/09 PHP
javascript基础第一章 JavaScript与用户端
2010/07/22 Javascript
JavaScript Memoization 让函数也有记忆功能
2011/10/27 Javascript
js数组Array sort方法使用深入分析
2013/02/21 Javascript
JavaScript数字和字符串转换示例
2014/03/26 Javascript
js构造函数、索引数组和属性的实现方式和使用
2014/11/16 Javascript
封装了jQuery的Ajax请求全局配置
2015/02/05 Javascript
url中的特殊符号有什么含义(推荐)
2016/06/17 Javascript
jQuery bt气泡实现悬停显示及移开隐藏功能的方法
2016/07/12 Javascript
KnockoutJS 3.X API 第四章之click绑定
2016/10/10 Javascript
AngularJS 与Bootstrap实现表格分页实例代码
2016/10/14 Javascript
jQuery Validate 无法验证 chosen-select元素的解决方法
2017/05/17 jQuery
AngularJS日程表案例详解
2017/08/15 Javascript
vue v-model实现自定义样式多选与单选功能
2018/07/05 Javascript
JS Object.preventExtensions(),Object.seal()与Object.freeze()用法实例分析
2018/08/25 Javascript
js中的闭包实例展示
2018/11/01 Javascript
解决微信小程序调用moveToLocation失效问题【超简单】
2019/04/12 Javascript
解决node.js含有%百分号时发送get请求时浏览器地址自动编码的问题
2019/11/20 Javascript
vue全屏事件开发详解
2020/06/17 Javascript
vue实现评价星星功能
2020/06/30 Javascript
JavaScript中的执行环境和作用域链
2020/09/04 Javascript
python实现的一个p2p文件传输实例
2014/06/04 Python
Python的Django框架中的URL配置与松耦合
2015/07/15 Python
在Python的Django框架中包装视图函数
2015/07/20 Python
浅析python打包工具distutils、setuptools
2018/04/20 Python
构建高效的python requests长连接池详解
2020/05/02 Python
Pycharm学生免费专业版安装教程的方法步骤
2020/09/24 Python
Django Admin后台模型列表页面如何添加自定义操作按钮
2020/11/11 Python
全球在线商店:BerryLook
2019/04/14 全球购物
环境日宣传活动总结
2014/07/09 职场文书
2019开业庆典剪彩仪式主持词!
2019/07/22 职场文书
SpringBoot全局异常处理方案分享
2022/05/25 Java/Android