前端如何导出excel csv文件

------------恢复内容开始------------

使用fetch方式导出文件, 用antdesign react UI设计

1. import fetch from ‘isomorphic-fetch‘;

import {message} from ‘antd‘;

2. 本地测试时和测试环境url的配置

let url = process.env.NODE_ENV===‘development‘ ? ‘localhost‘ : window.location.origin;

3.

fetch(`${url}/rwscxm/api/v1/casemgmt/report/export/incident/csv`, {

method: ‘post‘,

body: JSON.stringify(body),

headers: new Headers({

‘Content-Type‘: ‘application/json;charset=utf-8‘,

token : ‘‘

})

}).then(response => {

response.blob().then(blob => {

if (response.status !== 200) {

// 自定义打印消息,我们使用antdesign的组件进行消息通知

message.warn(‘File download error status: ‘ + response.status);

}

let fileName = ‘incident_report_summary_‘+new Date().toLocaleDateString()+‘.csv‘;

if (window.navigator.msSaveOrOpenBloc) {

navigator.msSaveBlod(blob, fileName);

} else {

const blobUrl = window.URL.createObjectURL(blob);

const aElement = document.createElement(‘a‘);

document.body.appendChild(aElement);

aElement.style.display = ‘none‘;

aElement.href = blobUrl;

aElement.download = fileName;

aElement.click();

document.body.removeChild(aElement);

}

})

}).catch(error => {

console.log(error);

});

------------恢复内容结束------------

使用fetch方式导出文件, 用antdesign react UI设计

1. import fetch from ‘isomorphic-fetch‘;

import {message} from ‘antd‘;

2. 本地测试时和测试环境url的配置

let url = process.env.NODE_ENV===‘development‘ ? ‘localhost‘ : window.location.origin;

3.

fetch(`${url}/rwscxm/api/v1/casemgmt/report/export/incident/csv`, {

method: ‘post‘,

body: JSON.stringify(body),

headers: new Headers({

‘Content-Type‘: ‘application/json;charset=utf-8‘,

token : ‘‘

})

}).then(response => {

response.blob().then(blob => {

if (response.status !== 200) {

// 自定义打印消息,我们使用antdesign的组件进行消息通知

message.warn(‘File download error status: ‘ + response.status);

}

let fileName = ‘incident_report_summary_‘+new Date().toLocaleDateString()+‘.csv‘;

if (window.navigator.msSaveOrOpenBloc) {

navigator.msSaveBlod(blob, fileName);

} else {

const blobUrl = window.URL.createObjectURL(blob);

const aElement = document.createElement(‘a‘);

document.body.appendChild(aElement);

aElement.style.display = ‘none‘;

aElement.href = blobUrl;

aElement.download = fileName;

aElement.click();

document.body.removeChild(aElement);

}

})

}).catch(error => {

console.log(error);

});

原文地址:https://www.cnblogs.com/dianfeng1/p/12144077.html

时间: 2024-10-07 07:00:23

前端如何导出excel csv文件的相关文章

在 Laravel 5 中使用 Laravel Excel 实现 Excel/CSV 文件导入导出功能(转)

1.简介 Laravel Excel 在 Laravel 5 中集成 PHPOffice 套件中的 PHPExcel ,从而方便我们以优雅的.富有表现力的代码实现Excel/CSV文件的导入和 导出 . 该项目的GitHub地址是: https://github.com/Maatwebsite/Laravel-Excel . 本文我们将在Laravel中使用Laravel Excel简单实现Excel文件的导入和导出. 2.安装&配置 使用Composer安装依赖 首先在Laravel项目根目录

在 Laravel 5 中使用 Laravel Excel 实现 Excel/CSV 文件导入导出功能

1.简介 Laravel Excel 在 Laravel 5 中集成 PHPOffice 套件中的 PHPExcel ,从而方便我们以优雅的.富有表现力的代码实现Excel/CSV文件的导入和 导出 . 该项目的GitHub地址是: https://github.com/Maatwebsite/Laravel-Excel . 本文我们将在Laravel中使用Laravel Excel简单实现Excel文件的导入和导出. 2.安装&配置 使用Composer安装依赖 首先在Laravel项目根目录

goalng导出excel(csv格式)

最近项目中有个小需求,需要将查询结果导出到excel.之间前java比较容易,使用POI很容易就能实现,查了下golang的文档,发现golang下边并没有导出excel的包,但是却有一个encoding/csv的包,看了下发现可以导出csv文件,大家都知道csv文件其实就是文本格式的excel文件,可以直接通过excel打开或是导入excel. 看起来挺好的,问题如愿解决,但是事实证明对已一个还不成熟的语言或是库最好还是先测一下的好.兴冲冲的卸了测试例子,成功导出了一个text.csv文件,一

R: 导入 csv 文件,导出到csv文件,;绘图后导出为图片、pdf等

################################################### 问题:导入 csv 文件 如何从csv文件中导入数据,?参数怎么设置?常用参数模板是啥? 解决方案: yuan <- read.csv(file = "C:/Users/Administrator/Desktop/test1.csv",header = TRUE,sep = ",",dec = ".", stringsAsFactors

oracle导出多CSV文件的靠谱的

oracle导出多CSV文件的问题 ---------------------------------------------------------------------- 用ksh脚本从oracle数据库中导出80w数据到csv文件,如用户给定名字为a.csv(文件最大4000行记录),则自动生产文件为a_1.csv,a_2.csv,...., a_200.csv 我已经实现了一个方法,但80w要导5小时,用户没法接受.如下: sqlplus -s user/pwd @${SqlDir}/

使用PHPExcel导入导出excel格式文件

使用PHPExcel导入导出excel格式文件 作者:zccst 由于导出使用较多,下面是导出实现过程. 第一步,将PHPExcel的源代码复制到项目的lib下 文件包括:PHPExcel.php 和 文件夹PHPExcel 源代码见附件 注1:源代码是zip格式,能在windows和linux通用. 注2:PHPExcel.zip是干净代码,可以直接引用.PHPExcel2.zip有svn记录,不适合直接引用. 第二步:在需要导出的handler页面中引用 1,在头部引入三个文件 Php代码 

原创 Datareader 导出为csv文件方法

DataReader 是游标只读数据, 如果是大数据导出,用Datatable 将耗费巨大内存资源.因为Datatable 其实就是内存中的一个数据表 代码如下 /// <summary> /// SqlDataReader 生成csv文件 /// </summary> /// <param name="fileNameCsv">文件名(包含文件路径)</param> /// <param name="dr"&g

ASP.NET Core 导入导出Excel xlsx 文件

ASP.NET Core 使用EPPlus.Core导入导出Excel xlsx 文件,EPPlus.Core支持Excel 2007/2010 xlsx文件导入导出,可以运行在Windows, Linux和Mac. EPPlus.Core 是基于EPPlus 更改而来,在Linux 下需要安装libgdiplus . EPPlus:http://epplus.codeplex.com/ EPPlus.Core:https://github.com/VahidN/EPPlus.Core 下面在A

淘宝助理导出的csv文件使用的是什么编码,您猜?

今天下午用Java读取从淘宝助理 V4.3 Beta1导出的csv文件,出现中文乱码情况. 一看就是文件编码引起的,不清楚淘宝助理导出的csv文件使用了什么编码,到百度搜索了一下,看到一些相关文章,但测试发现都没有解决这个问题. 最后,我抱着试试看的态度,使用了 utf-16 ,我晕,正常显示中文了. 关于 utf-16 这种编码,这么多看来我还是第一次使用,之前最常用的是 gb2312 和 utf-8 之间的转换. 下面是一个简单的例子: try { DataInputStream in =