前端导出xlsx

依赖安装（file-saver、xlsx）

npm install file-saver --save-dev
npm install xlsx --save-dev

导出封装

import FileSaver from 'file-saver';
import XLSX from 'xlsx';

exportExcel(id, title) { // 参数 id:dom；title:导出的文件名
  /* generate workbook object from table */
  const wb = XLSX.utils.table_to_book(document.querySelector(id));
  /* get binary string as output */
  const wbout = XLSX.write(wb, { bookType: 'xlsx', bookSST: true, type: 'array' });
  try {
    FileSaver.saveAs(new Blob([wbout], { type: 'application/octet-stream' }), title)
  } catch (e) {
    if (typeof console !== 'undefined') console.log(e, wbout)
  }
  return wbout;
}

调用

---

遇到问题

在使用中，有导出身份证号的需求，导出来的身份证号字段会失去精度(后几位为0)

解决方法

设置转换成excel时，使用原始的格式
XLSX.utils.table_to_book(document.querySelector(id), { raw: true })

exportExcel(id, title) {
  /* generate workbook object from table */
  let xlsxParam = { raw: true }; // 转换成excel时，使用原始的格式
  const wb = XLSX.utils.table_to_book(document.querySelector(id),xlsxParam);
  /* get binary string as output */
  const wbout = XLSX.write(wb, { bookType: 'xlsx', bookSST: true, type: 'array' });
  try {
    FileSaver.saveAs(new Blob([wbout], { type: 'application/octet-stream' }), title)
  } catch (e) {
    if (typeof console !== 'undefined') console.log(e, wbout)
  }
  return wbout;
}