前端实现JSON数据导出到doc的技巧

2023-09-25 20:05:38

前端导出JSON数据到doc的方法有多种，其中一种是利用docxtemplater库。docxtemplater是一个功能强大的库，可以帮助我们轻松地将JSON数据导出到doc文档中。

组件选择

由于导出Word需要保留一定的格式，因此我们选择docxtemplater库。docxtemplater利用定制导出模板的方式限制数据的导出格式。

实现一个最简单的导出

安装（后续的demo依赖相同）

npm install docxtemplater

用法：

const fs = require('fs');
const path = require('path');
const Docxtemplater = require('docxtemplater');

// Load the docx file as a binary
const content = fs.readFileSync(path.resolve(__dirname, 'template.docx'), 'binary');

// Create the doc object
const doc = new Docxtemplater(content);

// Set the template variables
doc.setData({
  name: 'John Doe',
  age: 30,
  city: 'New York',
});

// Render the document (replace all occurences of {first_name} by John, {age} by 30, {city} by New York)
doc.render();

// Get the docx file as a Buffer
const buf = doc.getZip().generate({type: 'nodebuffer'});

// Output the docx file to a folder
fs.writeFileSync(path.resolve(__dirname, 'output.docx'), buf);

导出复杂数据

const fs = require('fs');
const path = require('path');
const Docxtemplater = require('docxtemplater');

// Load the docx file as a binary
const content = fs.readFileSync(path.resolve(__dirname, 'template.docx'), 'binary');

// Create the doc object
const doc = new Docxtemplater(content);

// Set the template variables
doc.setData({
  name: 'John Doe',
  age: 30,
  city: 'New York',
  hobbies: [
    'Reading',
    'Writing',
    'Traveling',
  ],
});

// Render the document (replace all occurences of {first_name} by John, {age} by 30, {city} by New York, {hobbies} by Reading, Writing, Traveling)
doc.render();

// Get the docx file as a Buffer
const buf = doc.getZip().generate({type: 'nodebuffer'});

// Output the docx file to a folder
fs.writeFileSync(path.resolve(__dirname, 'output.docx'), buf);