这次把页面数据导出为一份excel文件由前端来完成！

支持格式例如：

[        {          name: 'AML',          phone: '123456',          email: '123@123456.com',        },        {          name: 'AML',          phone: '123456',          email: '123@123456.com',        },        {          name: 'I3',          phone: '123456',          email: '123@123456.com',        },        {          name: 'THEL',          phone: '123456',          email: '123@123456.com',        },      ]

具体实现代码：

function downloadExcel(jsonData, fileName) {
  // jsonData 数据源
  // fileName 导出的文件名称（xxxx.xls）
  
  // 获取base64位数据
  const base64 = (s) => window.btoa(unescape(encodeURIComponent(s)));

  // 拼接excel表头标题
  let str = Object.keys(jsonData[0] || {}).reduce((prev, next, index, arr) => {
    let _prev = prev;
    _prev += `<td>${next}</td>${index === arr.length - 1 ? '</tr>' : ''}`;
    return _prev;
  }, '<tr>');

  // 拼接主体数据
  for (let i = 0; i < jsonData.length; i += 1) {
    const value = Object.values(jsonData[i]).reduce((prev, next) => {
      let _prev = prev;
      _prev += `<td>${`${next}\t`}</td>`;
      return _prev;
    }, '');
    str += `<tr>${value}</tr>`;
  }

  // Worksheet名
  const worksheet = 'Sheet1';

  // 下载的表格模板数据
  const template = `<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">
      <head><meta charset="UTF-8"><!--[if gte mso 9]><xml><x:ExcelWorkbook><x:ExcelWorksheets><x:ExcelWorksheet>
        <x:Name>${worksheet}</x:Name>
        <x:WorksheetOptions><x:DisplayGridlines/></x:WorksheetOptions></x:ExcelWorksheet>
        </x:ExcelWorksheets></x:ExcelWorkbook></xml><![endif]-->
        </head><body><table>${str}</table></body></html>`;

  // 使用a标签触发下载行为
  const a = document.createElement('a');
  a.download = fileName;
  a.href = `data:application/vnd.ms-excel;base64,${base64(template)}`;
  a.click();
}

纯JS导出excel文件

这次把页面数据导出为一份excel文件由前端来完成！