(办公)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 ...
随机推荐
- LiveData使用
### Andorid LiveData 使用 [[_TOC_]] #### Lifycycle 使用1.继承FragmentActivity 实现LifecycleOwner接口2.声明一个Life ...
- springboot架构下运用shiro后在configuration,通过@Value获取不到值,总是为null
通过网上查找资料,是因为shiro的bean @Beanpublic LifecycleBeanPostProcessor lifecycleBeanPostProcessor() { return ...
- docker-compose 使用自定义网络并绑定 IP
0x00 事件 原先使用了 docker network create mynetwork 的方式创建了自定义网络,在使用 docker-compose 工具运行服务的时候,需要容器使用 mynetw ...
- Python语法速查: 2. 列表、元组、字典、集合操作
返回目录 (1)通用序列操作 “序列”表示索引为非负整数的有序对象集合,列表.元组.字符串都属于序列.区别在于:列表是可变的,而元组和字符串是不可变的.序列的通用操作他们都可以用. 操作或方法 简述 ...
- LRU的实现(使用list)
首先是LRU的定义,LRU表示最近最少使用,如果数据最近被访问过,那么将来被访问的几率也更高. 所以逻辑应该是每次都要将新被访问的页放到列表头部,如果超过了list长度限制,就将列表尾部的元素踢出去. ...
- 【测试点】微信小程序的常见测试点
第一次测试微信小程序,整理了一些必要的测试点和原则,以此为参考去设计详细测试用例
- java8-06-四大函数式接口
在使用lamdba表达式需要函数式接口的支持 java8已经提供了很多函数式接口 在java.util.function包下
- Linux下修改Mysql密码的三种方式
前言 有时我们会忘记Mysql的密码,或者想改一个密码,以下将对这两种情况修改密码的三种解决方法做个总结 本文都以用户为 root 为例 一.拥有原来的myql的root的密码 方法一: 在mysql ...
- 深入Pytorch微分传参
导数 这段代码揭示了多个变量的微分以及如何求解loss为向量的导数 m1 = Variable(torch.ones((3,2)), requires_grad=True) m2 = Variable ...
- php处理curl的返回结果
最简单的方式: json_decode($res,true): 结果都是: