前后端导出excel文件

前后端导出Excel文件有两种实现方式。

第一种是在前端直接将页面上的DOM元素打印到Excel文件。这种方式适用于所有数据在当前页面展示的情况。可以使用Vue自带的方法，将页面上的DOM元素转换成Excel表格，并保存为Excel文件。具体实现代码如下：

export function exportDomToXlsx(dom, name) {
  const table_book = XLSX.utils.table_to_book(dom, { raw: true })
  const table_write = XLSX.write(table_book, { bookType: 'xlsx', bookSST: true, type: 'array' })
  try {
    FileSaver.saveAs(
      new Blob([table_write], { type: 'application/octet-stream' }),
      name + '.xlsx'
    )
  } catch (e) {
    console.log(e, table_write)
  }
}

这个方法会将指定的DOM元素转换成Excel文件，并以给定的文件名保存。

第二种方式是在某些场景下，比如要导出的数据列表是分页的，或者需要导出的数据需要从后端获取的情况下，需要通过调用后端接口来实现导出。这种方式需要前后端分离，前端调用后端接口来获取导出的数据并生成Excel文件。

综上所述，前后端导出Excel文件的实现方式有两种，根据具体场景选择合适的方式来实现导出功能。<span class="em">1</span><span class="em">2</span><span class="em">3</span>
#### 引用[.reference_title]
- *1* *2* *3* [前后端分离场景下导出excel方法如何产品化？](https://blog.csdn.net/qq_42887496/article/details/123117949)[target="_blank" data-report-click={"spm":"1018.2226.3001.9630","extra":{"utm_source":"vip_chatgpt_common_search_pc_result","utm_medium":"distribute.pc_search_result.none-task-cask-2~all~insert_cask~default-1-null.142^v93^chatsearchT3_1"}}] [.reference_item style="max-width: 100%"]
[ .reference_list ]