将数据导出为 Word 文档（前端）

一个常用的库是 docxtemplater。它是一个简单易用的 JavaScript/Node.js 库，用于将数据注入到 Word 文档模板中并生成 Word 文档。

下面是一个示例代码，演示了如何在前端使用 docxtemplater 将数据导出为 Word 文档：

HTML：

<button id="exportButton">导出为 Word 文档</button>

JavaScript：

// 引入库文件
import * as Docxtemplater from 'docxtemplater';
import * as JSZip from 'jszip';
import * as saveAs from 'file-saver';

// 模拟数据
const data = [
  { name: 'John Doe', age: 30, city: 'New York' },
  { name: 'Jane Smith', age: 28, city: 'London' },
  { name: 'Bob Johnson', age: 35, city: 'Paris' }
];

// 获取 Word 文档模板
const getTemplate = () => {
  return fetch('template.docx')
    .then(response => response.arrayBuffer())
    .then(buffer => new Uint8Array(buffer));
};

// 根据模板和数据生成 Word 文档
const generateDocument = (template, data) => {
  const zip = new JSZip(template);
  const doc = new Docxtemplater().loadZip(zip);
  doc.setData({ people: data });
  doc.render();
  return doc.getZip().generate({ type: 'blob' });
};

// 导出 Word 文档
const exportDocument = async () => {
  try {
    const template = await getTemplate();
    const document = generateDocument(template, data);
    saveAs(document, 'data.docx');
  } catch (error) {
    console.error('导出文档出错：', error);
  }
};

// 监听导出按钮点击事件
document.getElementById('exportButton').addEventListener('click', exportDocument);

上述代码使用了 docxtemplater、jszip 和 file-saver 库来实现将数据导出为 Word 文档。您需要在项目中引入这些库，并将模板文件（如 template.docx）放在合适的位置，然后将文件名更新到代码中。

当用户点击 “导出为 Word 文档” 按钮时，会触发 exportDocument 函数。该函数从模板文件获取模板内容，然后将数据注入模板并生成 Word 文档。最后，使用 file-saver 将生成的 Word 文档进行下载。