后台方法的参数必须是@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方法的更多相关文章

  1. vue中下载excel的使用,后端链接两种情况,一个是链接,一个是文件流

    vue中下载excel使用 一.这是第一种情况,后台链接地址返回的是一个url,这个时候我只要在导出按钮上绑定exportData()这个事件方法就好了 exportData() {     this ...

  2. angularJS通过post方法下载excel文件

    最近工作中遇到,要使用angularJS的post方法来下载excel的情况.网上找到一个帖子:http://stackoverflow.com/questions/22447952/angularj ...

  3. SpringMVC Get请求传集合,前端"异步"下载excel 附SpringMVC 后台接受集合

    最近项目上管理后台需要自己做一部分js部分,之前都是前端来弄...碰到了下载excel,刚开始使用ajax,搞了好久发现不合适..下载不了,网上说ajax返回类型不支持二进制流.. 因此采用 wind ...

  4. 前端下载excel文件功能的三种方法

    1 从后端接收json数据,前端处理生成excel下载 JsonExportExcel的github地址:https://github.com/cuikangjie/JsonExportExcel 这 ...

  5. vue下载后台传过来的乱码流的解决办法

    后台返回的乱码流 解决办法: 请求方式用的是axios,主要加关键的 {responseType: 'blob'} axios封装 export function postDownload(url, ...

  6. vue Excel导入,下载Excel模板,导出Excel

    vue  Excel导入,下载Excel模板,导出Excel vue  Excel导入,下载Excel模板 <template> <div style="display: ...

  7. 关于vue 框架与后台框架的混合使用的尝试

    这几天我在研究前台框架和后台框架融合的问题,进行了一些尝试; 我前台选择的是 vue,当然也可以选择 react 等其他 mvvm 框架,不过 vue 对于我来说是最熟悉的; 后台话,我选择的是 ph ...

  8. 关于vue 框架与后台框架的混合使用的尝试------转载

    这几天我在研究前台框架和后台框架融合的问题,进行了一些尝试; 我前台选择的是 vue,当然也可以选择 react 等其他 mvvm 框架,不过 vue 对于我来说是最熟悉的; 后台话,我选择的是 ph ...

  9. 前端调用后端接口下载excel文件的几种方式

    今天有一个导出相应数据为excel表的需求.后端的接口返回一个数据流,一开始我用axios(ajax类库)调用接口,返回成功状态200,但是!但是浏览器没有自动下载excel表,当时觉得可能是ajax ...

随机推荐

  1. Mac版Sourcetree的安装使用

    本人也在亲测,感觉很有效,和大家分享,参考链接: https://www.jianshu.com/p/b8d0547a8449

  2. LeetCode刷题191117

    博主渣渣一枚,刷刷leetcode给自己瞅瞅,大神们由更好方法还望不吝赐教.题目及解法来自于力扣(LeetCode),传送门. 算法: 题目: 给出一个 32 位的有符号整数,你需要将这个整数中每位上 ...

  3. OSI参考模型总结

    OSI(Open System Interconnect),即开放式系统互联. 一般都叫OSI参考模型,是ISO(国际标准化组织)组织在1985年研究的网络互连模型.下面我们将一层一层的看OSI协议. ...

  4. flvjs的unload(),detachMediaElement(),destroy()报错,undefined,not a function解决方案

    首先,真的被网上一堆各种转载复制粘贴坑了不少,最后直接到GitHub上flvjs的看作者的demo和docs才解决,具体如下. 1.引入flvjs文件,新建实例 var flvUrl = '直播流地址 ...

  5. Docker容器数据卷介绍和命令

    是什么 一句话:有点类似我们Redis里面的rdb和aof文件 先来看看Docker的理念: *  将运用与运行的环境打包形成容器运行 ,运行可以伴随着容器,但是我们对数据的要求希望是持久化的 *   ...

  6. iotop使用方法

    iotop 是一个用来监视磁盘 I/O 使用状况的 top 类工具.iotop 具有与 top 相似的 UI,其中包括 PID.用户.I/O.进程等相关信息.   安装 yum install iot ...

  7. mysql中group by 使用

    问题描述 我现在需要查询表test,里面需要安装字段a 进行分组.分组之后还有按照b字段最大的.还要查询出字段c. 我先在使用的数据库是mysql8.0 解决 需注意: group by 分组的时候是 ...

  8. 新工具解决消息丢失的bug

    最近在调查一个消息丢失的bug,所幸客户的文本文件里有丢失的记录,但在localdb文件里找不到. 我当时的想法是,在运行report的时候把丢失的记录从文本文件找出来,然后添加到localdb里,最 ...

  9. 【转】 java常量池

    理论 jvm虚拟内存分布:      程序计数器是jvm执行程序的流水线,存放一些跳转指令.      本地方法栈是jvm调用操作系统方法所使用的栈.      虚拟机栈是jvm执行java代码所使用 ...

  10. 【译】3D打印:介绍

    原文地址:(需要翻墙)https://ordina-jworks.github.io/iot/2018/09/28/3D-Printing-Intro.html 文章发表日期:2018-09-28 第 ...