前端 json 导出 excel

最近做个导出功能，秉着前端能做的是绝不扔给后台想法，查了网上资料，大致两种，一种利用html直接输入excel ，一种是利用github上json 转excel。

首先说下第一种：

function JSONToExcelConvertor (JSONData, FileName, ShowLabel,worksheet) {

//先转化json

var arrData = typeof JSONData != 'object' ? JSON . parse (JSONData) : JSONData;

var excel = '';

//设置表头

var row = "

";

for ( var i = 0 , l = ShowLabel.length; i < l ; i ++) {

row += "

';

}

//换行

excel += row + "

";

//设置数据

for ( var i = 0 ; i < arrData .length; i ++) {

var row = "

";

for ( var key in arrData [ i ]) {

var value = arrData [ i ][ key ] == null ? "" : arrData [ i ][ key ];

row += '

';

}

excel += row + "

";

}

excel += "

" + ShowLabel[ i ] + '

' + value + '

" ;

var excelFile = " o ='urn:schemas-microsoft-com:office:office' xmlns: x ='urn:schemas-microsoft-com:office:excel' xmlns='http://www.w3.org/TR/REC-html40'>" ;

excelFile += '' ;

excelFile += ';

excelFile += '; charset=UTF-8">' ;

excelFile += "" ;

excelFile += "" ;

excelFile += "" ;

excelFile += "" ;

excelFile += excel ;

excelFile += "" ;

excelFile += "" ;

var uri = 'data:application/vnd.ms-excel;charset=utf-8,' + encodeURIComponent ( excelFile );

var link = document . createElement ( "a" );

link . href = uri ;

link . style = "visibility:hidden" ;

link . download = FileName + ".xls" ;

document . body . appendChild ( link );

link . click ();

document . body . removeChild ( link );

}

经测试，可以生成正常的excel.xls 格式，打开后样式有缺失，最重要的是如果拿该表格重新做导入上传，利用xlsm.js插件无法导入，具体缺少什么尚未发现。

只能另想办法了，继续上网搜资料json 转excel ，在github上有大神提供现成的插件，非常感谢！

https://cuikangjie.github.io/JsonExportExcel/dist/JsonExportExcel.min.js

在js中引入该插入后，导出excel变的非常简单

function JsonToExcel (jsonData,fileName,sheetName,sheetHeader) {

var option = {};

option . fileName = fileName;

option . datas = [

{

sheetData : jsonData,

sheetName : sheetName,

sheetHeader : sheetHeader

}

];

var toExcel = new ExportJsonExcel ( option );

toExcel . saveExcel ();

}

而且测试发现，格式是最新的xlsm，且样式未缺失，上传也无格式问题