最近有JSON導出Excel的需求，查看了很多大神的例子。記錄一下
參考：https://blog.csdn.net/baidu_28665563/article/details/86225970
exportExcel.js代碼爲：
export const exportExcel = (JSONData, FileName, title, filter) => {
if (!JSONData) return;
//轉化json爲object
var arrData = typeof JSONData != "object" ? JSON.parse(JSONData) : JSONData;
var excel = "<table>";
//設置表頭
var row = "<tr>";
if (title) { //使用標題項
for (var i in title) {
if (typeof (title[i]) == 'string') {
row += "<th align='center'>" + title[i] + "</th>";
}
}
} else { //不使用標題項
for (var i in arrData[0]) {
row += "<th align='center'>" + i + "</th>";
}
}
excel += row + "</tr>";
//設置數據
for (var i = 0; i < arrData.length; i++) {
var row = "<tr>";
for (var index in arrData[i]) {
//判斷是否有過濾行
if (filter) {
if (filter.indexOf(index) == -1) {
var value = arrData[i][index] == null ? "" : arrData[i][index];
row += "<td>" + value + "</td>";
}
} else {
var value = arrData[i][index] == null ? "" : arrData[i][index];
row += "<td align='center' style='width: 90px;'>" + value + "</td>";
}
}
excel += row + "</tr>";
}
excel += "</table>";
var excelFile =
"<html xmlns:o='urn:schemas-microsoft-com:office:office' xmlns:x='urn:schemas-microsoft-com:office:excel' xmlns='http://www.w3.org/TR/REC-html40'>";
excelFile +=
'<meta http-equiv="content-type" content="application/vnd.ms-excel; charset=UTF-8">';
excelFile +=
'<meta http-equiv="content-type" content="application/vnd.ms-excel';
excelFile += '; charset=UTF-8">';
excelFile += "<head>";
excelFile += "<!--[if gte mso 9]>";
excelFile += "<xml>";
excelFile += "<x:ExcelWorkbook>";
excelFile += "<x:ExcelWorksheets>";
excelFile += "<x:ExcelWorksheet>";
excelFile += "<x:Name>";
excelFile += "{worksheet}";
excelFile += "</x:Name>";
excelFile += "<x:WorksheetOptions>";
excelFile += "<x:DisplayGridlines/>";
excelFile += "</x:WorksheetOptions>";
excelFile += "</x:ExcelWorksheet>";
excelFile += "</x:ExcelWorksheets>";
excelFile += "</x:ExcelWorkbook>";
excelFile += "</xml>";
excelFile += "<![endif]-->";
excelFile += "</head>";
excelFile += "<body>";
excelFile += excel;
excelFile += "</body>";
excelFile += "</html>";
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);
}
上述代碼是略微修改後的代碼。修改部分爲：
if (title) { //使用標題項
for (var i in title) {
if (typeof (title[i]) == 'string') {
row += "<th align='center'>" + title[i] + "</th>";
}
}
} else { //不使用標題項
for (var i in arrData[0]) {
row += "<th align='center'>" + i + "</th>";
}
}
因爲如果傳入title後，在遍歷的時候會多遍歷出來三個函數在表頭後面。所以加了一個篩選條件。
調用方法：
let title = ['序號', '宿舍樓', '樓層', '宿舍', '姓名', '班級', '人臉信息', '說明'];
let fileName = '附錄:未' + this.schedulesType + '學生名單';
let JSONData = JSON.stringify(this.downloadData)
exportExcel(JSONData, fileName, title);
其中title爲表格header filename爲表格名字 JSONData爲表格內數據。 還接受一個參數filter爲過濾項。