我知道有很多这种性质的问题,但我需要使用JavaScript来做到这一点。我使用Dojo 1.8并在数组中拥有所有属性信息,它看起来像这样:
[["name1", "city_name1", ...]["name2", "city_name2", ...]]
知道我如何在客户端将此导出为CSV吗?
我知道有很多这种性质的问题,但我需要使用JavaScript来做到这一点。我使用Dojo 1.8并在数组中拥有所有属性信息,它看起来像这样:
[["name1", "city_name1", ...]["name2", "city_name2", ...]]
知道我如何在客户端将此导出为CSV吗?
当前回答
ES6的一个箭头函数:
const dataToCsvURI = (data) => encodeURI(
`data:text/csv;charset=utf-8,${data.map((row, index) => row.join(',')).join(`\n`)}`
);
然后:
window.open(
dataToCsvURI(
[["name1", "city_name1"/*, ...*/], ["name2", "city_name2"/*, ...*/]]
)
);
如果有人在reactjs中需要这个,react-csv就在那里
其他回答
一个极简但功能完整的解决方案:)
/** Convert a 2D array into a CSV string
*/
function arrayToCsv(data){
return data.map(row =>
row
.map(String) // convert every value to String
.map(v => v.replaceAll('"', '""')) // escape double colons
.map(v => `"${v}"`) // quote it
.join(',') // comma-separated
).join('\r\n'); // rows starting on new lines
}
例子:
let csv = arrayToCsv([
[1, '2', '"3"'],
[true, null, undefined],
]);
结果:
"1","2","""3"""
"true","null","undefined"
现在将其下载为文件:
/** Download contents as a file
* Source: https://stackoverflow.com/questions/14964035/how-to-export-javascript-array-info-to-csv-on-client-side
*/
function downloadBlob(content, filename, contentType) {
// Create a blob
var blob = new Blob([content], { type: contentType });
var url = URL.createObjectURL(blob);
// Create a link to download it
var pom = document.createElement('a');
pom.href = url;
pom.setAttribute('download', filename);
pom.click();
}
下载:
downloadBlob(csv, 'export.csv', 'text/csv;charset=utf-8;')
在Chrome 35更新中,下载属性行为发生改变。
https://code.google.com/p/chromium/issues/detail?id=373182
要在chrome中工作,使用这个
var pom = document.createElement('a');
var csvContent=csv; //here we load our csv data
var blob = new Blob([csvContent],{type: 'text/csv;charset=utf-8;'});
var url = URL.createObjectURL(blob);
pom.href = url;
pom.setAttribute('download', 'foo.csv');
pom.click();
如果有人需要这个敲除js,它的工作好基本上提出的解决方案:
html:
<a data-bind="attr: {download: filename, href: csvContent}">Download</a>
视图模型:
// for the download link
this.filename = ko.computed(function () {
return ko.unwrap(this.id) + '.csv';
}, this);
this.csvContent = ko.computed(function () {
if (!this.csvLink) {
var data = ko.unwrap(this.data),
ret = 'data:text/csv;charset=utf-8,';
ret += data.map(function (row) {
return row.join(',');
}).join('\n');
return encodeURI(ret);
}
}, this);
您可以使用下面的代码段使用Javascript将数组导出到CSV文件。
这也可以处理特殊字符部分
var arrayContent = [["Séjour 1, é,í,ú,ü,ű"],["Séjour 2, é,í,ú,ü,ű"]];
var csvContent = arrayContent.join("\n");
var link = window.document.createElement("a");
link.setAttribute("href", "data:text/csv;charset=utf-8,%EF%BB%BF" + encodeURI(csvContent));
link.setAttribute("download", "upload_data.csv");
link.click();
这里是jsfiddle工作的链接
下面是一个原生的js解决方案。
function export2csv() { let data = ""; const tableData = []; const rows = [ ['111', '222', '333'], ['aaa', 'bbb', 'ccc'], ['AAA', 'BBB', 'CCC'] ]; for (const row of rows) { const rowData = []; for (const column of row) { rowData.push(column); } tableData.push(rowData.join(",")); } data += tableData.join("\n"); const a = document.createElement("a"); a.href = URL.createObjectURL(new Blob([data], { type: "text/csv" })); a.setAttribute("download", "data.csv"); document.body.appendChild(a); a.click(); document.body.removeChild(a); } <button onclick="export2csv()">Export array to csv file</button>