后台方法的参数必须是@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. 一文解读MVC/MVP/MVVM (转)

    这篇文章对目前 GUI 应用中的 MVC.MVP 和 MVVM 架构模式进行详细地介绍. MVC 在整个 GUI 编程领域,MVC 已经拥有将近 50 年的历史了.早在几十年前,Smalltalk-7 ...

  2. centos7服务器监控之nmon

    一.下载nmon 根据系统类型下载相应的版本: http://nmon.sourceforge.net/pmwiki.php?n=Site.Download 目前大多数服务器使用的centos7系统, ...

  3. vue/cli2.0优化

    vue/cli2.0 脚手架 在项目写完了之后, 运行npm run build --report可以看出这个项目的资源占比情况.可以看出整个项目哪一个资源在整个项目占比最大.它会自动打开一个可视化的 ...

  4. selenium如何向ueditor富文本中自动输入文本

    1.网上给出的方法在百度的富文本控件ueditor中不起作用切换框架失败 2.利用ueditor的api文档,通过js不使用框架切换即可实现轻松写入 eg:ue.setContent('hello')

  5. 设计模式-Template(行为模式) 采用 继承的方式 将算法封装在抽象基类中,在子类中实现细节。利用面向对象中的多态实现算法实现细节和高层接口的松耦合。

    以下代码来源: 设计模式精解-GoF 23种设计模式解析附C++实现源码 //Template.h class AbstractClass { public: virtual ~AbstractCla ...

  6. ZEN、ELECTRA、ALBERT

    一.ZEN 目前,大多数中文预训练模型基本上沿用了英文模型的做法,聚焦于小颗粒度文本单元(字)的输入.然而,与英文相比,中文没有空格等明确的词语边界.这个特点使得很多文本表达中存在的交叉歧义也被带入了 ...

  7. 关于group by的用法 原理

    转载: https://blog.csdn.net/u014717572/article/details/80687042. 写在前面的话:用了好久group by,今天早上一觉醒来,突然感觉grou ...

  8. fastdfs使用总结

    参考:https://www.cnblogs.com/chiangchou/p/fastdfs.html   说明:这篇博客是为了记录我在安装和使用FastDFS分布式文件系统时遇到的问题和解决方法, ...

  9. PHP 多进程和多线程的优缺点

    PHP 多进程和多线程的优缺点 多进程 1.使用多进程, 子进程结束以后, 内核会负责回收资源 2.使用多进程, 子进程异常退出不会导致整个进程Thread退出. 父进程还有机会重建流程. 3.一个常 ...

  10. Docker学习——Dockerfile

    上一篇我们讲了docker的基本使用,掌握了前一篇,docker使用基本不成问题,但是要是你学习了Dockerfile,你会发现它使用起来有多方便了.项目最终部署时,我们希望docker容器打开时项目 ...