1.装置xlsx插件。
yarn add xlsx 2.export.js文件封装导出函数。
import XLSX from 'xlsx';function workbook2blob (workbook) { // 生成excel的配置项 const wopts = { // 要生成的文件类型 bookType: 'xlsx', // 是否生成Shared String Table，官网解释是，如果开启生成速度会降落，但在低版本IOS设施上有更好的兼容性 bookSST: false, type: 'binary' }; const wbout = XLSX.write(workbook, wopts); // 将字符串转ArrayBuffer function s2ab (s) { var buf = new ArrayBuffer(s.length); var view = new Uint8Array(buf); for (var i = 0; i !== s.length; ++i) view[i] = s.charCodeAt(i) & 0xff; return buf; } const buf = s2ab(wbout); const blob = new Blob([buf], { type: 'application/octet-stream' }); return blob;}// 将blob对象 创立bloburl,而后用a标签实现弹出下载框function openDownloadDialog (blob, fileName) { if (typeof blob === 'object' && blob instanceof Blob) { blob = URL.createObjectURL(blob); // 创立blob地址 } const aLink = document.createElement('a'); aLink.href = blob; // HTML5新增的属性，指定保留文件名，能够不要后缀，留神，有时候 file:///模式下不会失效 aLink.download = fileName || ''; let event; if (window.MouseEvent) event = new MouseEvent('click'); // 挪动端 else { event = document.createEvent('MouseEvents'); event.initMouseEvent( 'click', true, false, window, 0, 0, 0, 0, 0, false, false, false, false, 0, null ); } aLink.dispatchEvent(event);}function exportExcel ({ name, data }) { // let name = 'www'; // const data = [ // { // data: [ // { department: '行政部', count: 2 }, // { department: '行政部', count: 2 } // ], // sheetName: 'sss' // }, // { // data: [ // { name: '李四', do: '打印' }, // { name: '李四', do: '打印' } // ], // sheetName: 'sss2' // } // ]; const wb = XLSX.utils.book_new(); data.forEach(item => { const sheet = XLSX.utils.json_to_sheet(item.sheetData); //设置列宽 sheet['!cols'] = [ { wch: 10 }, { wch: 10 }, { wch: 10 }, { wch: 10 }, { wch: 10 }, { wch: 5 }, { wch: 5 }, { wch: 5 }, { wch: 10 }, { wch: 12 }, { wch: 50 } ]; XLSX.utils.book_append_sheet(wb, sheet, item.sheetName); }); const workbookBlob = workbook2blob(wb); openDownloadDialog(workbookBlob, `${name}.xlsx`);}export default exportExcel;3.触发导出事件，传入参数。
exportCheckList () { const arr = [ { sheetName: '地夜阑', sheetData: [] }, { sheetName: '地夜阑2', sheetData: [] } ]; //解决数据格式 //const data = this.handleExportData(arr); const name = 'test'; import('./export.js').then(res => { res.default({ data, name }); }); },