码迷,mamicode.com
首页 > 其他好文 > 详细

ant design 中,使用dva/fetch 设置导致无法从后台导出excel的问题

时间:2018-08-09 12:12:20      阅读:401      评论:0      收藏:0      [点我收藏+]

标签:read   color   design   nav   else   head   excel   code   一个   

最近使用antd 做一个后台管理系统中,业务场景下需要将数据导出为excel,后端使用POI,结果数据怎么都无法生成,后面发现原来是前端限制了header 中可以接受的数据类型为json,无法接受blob的类型,后来改用了axios,就可以顺利导出了,下面是导出的代码

 

 1 import axios from ‘axios‘;
 2 
 3 async function getExcel(url, fileName) {
 4   const token = localStorage.getItem(‘token‘);
 5   axios
 6     .get(url, {
 7       responseType: ‘blob‘, // 表明返回服务器返回的数据类型,
 8       headers: {
 9         Authorization: ‘Bearer ‘ + token,
10         Accept: ‘application/json‘,
11       },
12     })
13     .then(res => {
14       const content = res;
15       const blob = new Blob([content.data], {
16         type: ‘application/vnd.openxmlformats-officedocument.spreadsheetml.sheet;charset=utf-8‘,
17       });
18       // return;
19       if (‘download‘ in document.createElement(‘a‘)) {
20         // 非IE下载
21         const elink = document.createElement(‘a‘);
22         elink.download = fileName;
23         elink.style.display = ‘none‘;
24         elink.target = ‘_blank‘;
25         elink.href = URL.createObjectURL(blob);
26         document.body.appendChild(elink);
27         console.log(elink);
28         elink.click();
29         URL.revokeObjectURL(elink.href); // 释放URL 对象
30         document.body.removeChild(elink);
31         // window.location.reload();
32       } else {
33         // IE10+下载
34         navigator.msSaveBlob(blob, fileName);
35         window.location.reload();
36       }
37     });
38 }
39 export default {
40   getExcel,
41 };

 

ant design 中,使用dva/fetch 设置导致无法从后台导出excel的问题

标签:read   color   design   nav   else   head   excel   code   一个   

原文地址:https://www.cnblogs.com/zhangsdml/p/9447784.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!