Vue exports tables ending in .xlsx
1. First, npm downloads two dependencies (file-saver xlsx)
npm install -S file-saver xlsx
2. Import these two dependencies (file-saver xlsx) on the page that needs to export .xlsx:
import FileSaver from "file-saver";
import XLSX from "xlsx";
3.js part:
exportExcel() {
// 设置当前日期
let time = new Date();
let year = time.getFullYear();
let month = time.getMonth() + 1;
let day = time.getDate();
let name = "故障信息" + year + "" + month + "" + day;
// console.log(name)
/* generate workbook object from table */
// .table要导出的是哪一个表格
var wb = XLSX.utils.table_to_book(document.querySelector(".table"));
/* get binary string as output */
var wbout = XLSX.write(wb, {
bookType: "xlsx",
bookSST: true,
type: "array",
});
try {
// name+'.xlsx'表示导出的excel表格名字
FileSaver.saveAs(
new Blob([wbout], {
type: "application/octet-stream" }),
name + ".xlsx"
);
} catch (e) {
if (typeof console !== "undefined") console.log(e, wbout);
}
return wbout;
},
4. As shown in the figure:
Need to export the part, add the table class in that part;
Display: