vue 导出word

// 导入必要的库
import { saveAs } from 'file-saver';
import * as docxtemplater from 'docxtemplater';
import PizZip from 'pizzip';
import PizZipUtils from 'pizzip/utils/index.js';

// 加载模板文件
function loadFile(url, callback) {
  PizZipUtils.getBinaryContent(url, callback);
}

// 创建导出Word文档的函数
function exportWord(templateUrl, data, outputFileName) {
  loadFile(templateUrl, function(error, content) {
    if (error) { throw error; }

    // 创建一个新的PizZip实例
    const zip = new PizZip(content);

    // 创建一个新的docxtemplater实例
    const doc = new docxtemplater(zip, {
      paragraphLoop: true,
      linebreaks: true,
    });

    // 渲染模板并填充数据
    doc.render(data);

    // 将生成的文档转换为二进制流
    const out = doc.getZip().generate({
      type: 'blob',
      mimeType: 'application/vnd.openxmlformats-officedocument.wordprocessingml.document'
    });

    // 使用file-saver保存文件
    saveAs(out, `${outputFileName}.docx`);
  });
}

// 示例使用
const templateUrl = './template.docx'; // 模板文件路径
const data = {
  title: 'Vue导出Word示例',
  content: '这是通过Vue导出的Word文档内容。'
};
const outputFileName = 'vue-export-word';

exportWord(templateUrl, data, outputFileName);

解释说明：

1. 导入库：我们使用了 file-saver 库来处理文件下载，docxtemplater 来处理Word模板渲染，以及 PizZip 和 PizZipUtils 来处理压缩文件。
2. 加载模板文件：loadFile 函数用于从指定URL加载Word模板文件。
3. 创建导出Word文档的函数：exportWord 函数接收模板文件路径、要填充的数据和输出文件名作为参数。
4. 渲染模板并填充数据：使用 docxtemplater 渲染模板，并将传入的数据填充到模板中。
5. 保存文件：最后使用 file-saver 的 saveAs 方法将生成的Word文档保存到本地。

这个示例展示了如何在Vue项目中通过模板导出Word文档。你需要确保在项目中安装了所需的依赖库。