(办公)vue下载excel,后台用post方法
后台方法的参数必须是@RequestBody修饰的。
前台关键代码:
axios ( {
method : 'post',
url : api.exportPlayTime , // 请求地址
data : {
choose : type,
begindate : startDate,
enddate : endDate
},
responseType : 'arraybuffer',
observe: 'response',
} )
.then ( ( res ) => {
const fileName = ""+filename+".xlsx"
let blob = new Blob([res.data], {type: "application/vnd.openxmlformats-officedocument.spreadsheetml.sheet"});
if ( 'download' in document.createElement ( 'a' ) ) { // 非IE下载
const elink = document.createElement ( 'a' )
elink.download = fileName
elink.style.display = 'none'
elink.href = URL.createObjectURL ( blob )
document.body.appendChild ( elink )
elink.click ()
URL.revokeObjectURL ( elink.href ) // 释放URL 对象
document.body.removeChild ( elink )
} else { // IE10+下载
navigator.msSaveBlob ( blob, fileName )
}
})
download(data) {
if (!data) {
return
}
let url = window.URL.createObjectURL(new Blob([data]))
let link = document.createElement('a')
link.style.display = 'none'
link.href = url
link.setAttribute('download', 'excel.xlsx')
document.body.appendChild(link)
link.click()
},
(办公)vue下载excel,后台用post方法的更多相关文章
- vue中下载excel的使用,后端链接两种情况,一个是链接,一个是文件流
vue中下载excel使用 一.这是第一种情况,后台链接地址返回的是一个url,这个时候我只要在导出按钮上绑定exportData()这个事件方法就好了 exportData() { this ...
- angularJS通过post方法下载excel文件
最近工作中遇到,要使用angularJS的post方法来下载excel的情况.网上找到一个帖子:http://stackoverflow.com/questions/22447952/angularj ...
- SpringMVC Get请求传集合,前端"异步"下载excel 附SpringMVC 后台接受集合
最近项目上管理后台需要自己做一部分js部分,之前都是前端来弄...碰到了下载excel,刚开始使用ajax,搞了好久发现不合适..下载不了,网上说ajax返回类型不支持二进制流.. 因此采用 wind ...
- 前端下载excel文件功能的三种方法
1 从后端接收json数据,前端处理生成excel下载 JsonExportExcel的github地址:https://github.com/cuikangjie/JsonExportExcel 这 ...
- vue下载后台传过来的乱码流的解决办法
后台返回的乱码流 解决办法: 请求方式用的是axios,主要加关键的 {responseType: 'blob'} axios封装 export function postDownload(url, ...
- vue Excel导入,下载Excel模板,导出Excel
vue Excel导入,下载Excel模板,导出Excel vue Excel导入,下载Excel模板 <template> <div style="display: ...
- 关于vue 框架与后台框架的混合使用的尝试
这几天我在研究前台框架和后台框架融合的问题,进行了一些尝试; 我前台选择的是 vue,当然也可以选择 react 等其他 mvvm 框架,不过 vue 对于我来说是最熟悉的; 后台话,我选择的是 ph ...
- 关于vue 框架与后台框架的混合使用的尝试------转载
这几天我在研究前台框架和后台框架融合的问题,进行了一些尝试; 我前台选择的是 vue,当然也可以选择 react 等其他 mvvm 框架,不过 vue 对于我来说是最熟悉的; 后台话,我选择的是 ph ...
- 前端调用后端接口下载excel文件的几种方式
今天有一个导出相应数据为excel表的需求.后端的接口返回一个数据流,一开始我用axios(ajax类库)调用接口,返回成功状态200,但是!但是浏览器没有自动下载excel表,当时觉得可能是ajax ...
随机推荐
- 如何在Macbook上安装MySQL ?
MySQL是常用的一款开源数据库,对各个平台都提供了支持,而Macbook又作为程序员的一款主力开发工具经常被使用.因此怎么在Macbook上安装MySQL进行程序开发也成了一项基本技能.下面来跟随本 ...
- EXPDP导数报ORA-00942案例
使用数据泵(expdp)导数时遇到了ORA-31626 & ORA-00942 错误,数据库版本为Oracle Database 10g Release 10.2.0.5.0,具体错误如下所示 ...
- tornado的IOLoop.instance()方法和IOLoop.current()方法区别
在使用tornado时,经常有人疑惑IOLoop.instance()方法和IOLoop.current()方法的区别是什么. IOLoop.instance() 返回一个全局 IOLoop实例. 大 ...
- 一、itk在VS2019上面的安装 和例子(HelloWorld)运行
一.Itk简介 vtk是专门用于医疗图像处理的函数库,类似opencv. 这篇博客主要是讲解安装vtk之后的例子的运行,即如何构建自己的第一个ITK例子 二.Itk安装 Itk安装参考这篇博客: ht ...
- for循环创建的a标签,当点击时如何确定点击的是哪一个标签?
创建 代码: js: 效果: 原因: html代码:这种获取选中标签的方式,是通过监听body来实现的,所以body上要增加这个onclick(this)
- Vue 监听鼠标左键 鼠标右键以及鼠标中键修饰符click.left&contextmenu&click.middle
<!doctype html> <html lang="en"> <head> <meta charset="UTF-8&quo ...
- 【LOJ6620】「THUPC 2019」不等式 / inequality(线段树)
点此看题面 大致题意: 给你两个长度为\(n\)的数组\(a_i\)和\(b_i\),定义\(f_k(x)=\sum_{i=1}^k|a_ix+b_i|\),对于\(k=1\sim n\)的每个\(f ...
- 通过yum在centos安装mysql并配置远程登录
前言 前天按照Oracle上的文档装了一遍mysql,选了最新8.0的版本,后来出现一些问题,网上搜答案,出来的基本还是5.x版本的解决方案,并不适用8.0版本.然后我就去看了一下公司的正式环境买的阿 ...
- python-pandas读取mongodb、读取csv文件
续上一篇博客(‘’selenium爬取NBA并将数据存储到MongoDB‘)https://www.cnblogs.com/lutt/p/10810581.html 本篇的内容是将存储到mongo的数 ...
- 想成为Python高手,必须看这篇爬虫原理介绍!(附29个爬虫项目)
互联网是由一个个站点和网络设备组成的大网,我们通过浏览器访问站点,站点把HTML.JS.CSS代码返回给浏览器,这些代码经过浏览器解析.渲染,将丰富多彩的网页呈现我们眼前. 一.爬虫是什么? 如果我们 ...