vue + axios get下载文件功能


Posted in Javascript onSeptember 25, 2019

本文实例为大家分享了vue + axios 下载文件的具体代码,供大家参考,具体内容如下

这里是axios的get方法。post方法请点击这里=》here

vue + axios get下载文件功能

注意点:

Herder 请求头需注意

  • content-disposition:”attachment;filename=total.xls”
  • content-type:”application/x-download;charset=utf-8”

axios请求的responseType为blob

  • responseType:'blob',

template

<button class="os_myProduct_td6Div5Btn2" @click.stop="downloadReport(item,index)">下载当天报表</button>

script

methods:{
 downloadReport(item,index){
 let date = item.plans[this.daysIndex[index]]
 let url = '/Ecp.Export.exportXls.jdn?entityId='+item.FId+'&date='+date.FDeparture_date+'&token=' + sessionStorage.getItem("token")
 this.axios({
 method:'get',
 url:url,
 responseType:'blob',
 })
 .then((data) => {
 if (!data) {
  return
 }
 debugger
 let url = window.URL.createObjectURL(data.data)
 let link = document.createElement('a')
 link.style.display = 'none'
 link.href = url
 link.setAttribute('download', 'excel.xls')
 document.body.appendChild(link)
 link.click()
 })
 },
 }

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
扩展javascript的Date方法实现代码(prototype)
Nov 20 Javascript
JavaScript入门之事件、cookie、定时等
Oct 21 Javascript
js实现文字闪烁特效的方法
Dec 17 Javascript
JS组件系列之Bootstrap Icon图标选择组件
Jan 28 Javascript
基于JavaScript实现自动更新倒计时效果
Dec 19 Javascript
js实现显示手机号码效果
Mar 09 Javascript
addEventListener()与removeEventListener()解析
Apr 20 Javascript
Vue.js鼠标悬浮更换图片功能
May 17 Javascript
vue.js实例todoList项目
Jul 07 Javascript
js校验开始时间和结束时间
May 26 Javascript
如何阻止移动端浏览器点击图片浏览
Aug 29 Javascript
WebPack工具运行原理及入门教程
Dec 02 Javascript
layer.open组件获取弹出层页面变量、函数的实例
Sep 25 #Javascript
jquery中attr、prop、data区别与用法分析
Sep 25 #jQuery
axios实现文件上传并获取进度
Mar 25 #Javascript
Layer+Echarts构建弹出层折线图的方法
Sep 25 #Javascript
axios实现简单文件上传功能
Sep 25 #Javascript
layer弹出层取消遮罩的方法
Sep 25 #Javascript
QML实现圆环颜色选择器
Sep 25 #Javascript
You might like
php中文件上传的安全问题
2006/10/09 PHP
在PHP中使用redis
2013/11/04 PHP
smarty模板判断数组为空的方法
2015/06/10 PHP
浅谈php错误提示及查错方法
2015/07/14 PHP
php上传大文件设置方法
2016/04/14 PHP
laravel model 两表联查示例
2019/10/24 PHP
Jquery实现点击按钮,连续地向textarea中添加值的实例代码
2014/03/08 Javascript
javascript函数命名的三种方式及区别介绍
2016/03/22 Javascript
解析浏览器端的AJAX缓存机制
2016/06/21 Javascript
浅谈toLowerCase和toLocaleLowerCase的区别
2016/08/15 Javascript
JavaScript获取服务器端时间的方法
2016/11/29 Javascript
JavaScript创建对象方法实例小结
2018/09/03 Javascript
实例讲解JS中pop使用方法
2019/01/27 Javascript
利用原生JavaScript实现造日历轮子实例代码
2019/05/08 Javascript
原生js滑动轮播封装
2020/07/31 Javascript
JavaScript 闭包的使用场景
2020/09/17 Javascript
vue实现简单加法计算器
2020/10/22 Javascript
Python实现的一个简单LRU cache
2014/09/26 Python
用Python编写web API的教程
2015/04/30 Python
django的ORM操作 增加和查询
2019/07/26 Python
对Django url的几种使用方式详解
2019/08/06 Python
简单了解python 生成器 列表推导式 生成器表达式
2019/08/22 Python
Django将默认的SQLite更换为MySQL的实现
2019/11/18 Python
html5的新玩法——语音搜索
2013/01/03 HTML / CSS
将HTML5 Canvas的内容保存为图片借助toDataURL实现
2013/05/20 HTML / CSS
StubHub西班牙:购买和出售全球活动门票
2017/06/05 全球购物
KARATOV珠宝在线商店:俄罗斯珠宝品牌
2019/03/13 全球购物
新闻网站实习自我鉴定
2013/09/25 职场文书
主管职责范文
2013/11/09 职场文书
学前班幼儿评语大全
2014/12/29 职场文书
山楂树之恋观后感
2015/06/11 职场文书
复活读书笔记
2015/06/29 职场文书
听证会主持词
2015/07/03 职场文书
2016入党积极分子考察评语
2015/12/01 职场文书
canvas多重阴影发光效果实现
2021/04/20 Javascript
低门槛开发iOS、Android、小程序应用的前端框架详解
2021/10/16 Javascript