uni-app中是否支持根据模板导出excel和word,并在模板中的{变量}位置进行填充

发布于 1周前 作者 zlyuanteng 来自 Uni-App

uni-app中是否支持根据模板导出excel和word,并在模板中的{变量}位置进行填充

填充模板生成文件

uni-app 中可不可以根据模版导出excel,word 在模版里面{变量}进行填充,类似docxtemplater 一样

1 回复

在uni-app中,虽然直接内置的功能并不支持根据模板导出Excel和Word文件,并填充模板中的变量,但你可以通过结合服务器端脚本和前端请求来实现这一功能。以下是一个基本的实现思路,并附上相关的代码案例。

实现思路

  1. 准备模板:在服务器端准备好Excel或Word模板,模板中包含占位符(如{变量})。
  2. 服务器端脚本:编写服务器端脚本(如Node.js、Python等),读取模板,替换占位符,并生成最终文件。
  3. 前端请求:在uni-app中,通过HTTP请求调用服务器端API,传递需要填充的数据。
  4. 文件下载:服务器端生成文件后,返回文件下载链接或直接以附件形式返回文件。

代码案例

服务器端(Node.js示例)

使用xlsx库处理Excel,pizzipdocxtemplater处理Word。

const express = require('express');
const fs = require('fs');
const path = require('path');
const XLSX = require('xlsx');
const PizZip = require('pizzip');
const Docxtemplater = require('docxtemplater');

const app = express();
app.use(express.json());

app.post('/export/excel', (req, res) => {
    const data = req.body.data;
    const workbook = XLSX.readFile('template.xlsx');
    const sheetName = workbook.SheetNames[0];
    const worksheet = workbook.Sheets[sheetName];

    // 假设模板中有一个单元格内容为"{name}"
    for (let R of XLSX.utils.sheet_to_json(worksheet, { header: 1 })) {
        if (R['A'] === '{name}') {
            R['A'] = data.name;
        }
    }

    const newWorkbook = XLSX.utils.book_new();
    XLSX.utils.book_append_sheet(newWorkbook, XLSX.utils.json_to_sheet(XLSX.utils.sheet_to_json(worksheet)), sheetName);
    XLSX.writeFile(newWorkbook, 'output.xlsx');

    // 返回下载链接或直接发送文件(需处理跨域等问题)
    res.send({ fileUrl: '/path/to/output.xlsx' });
});

// 类似地处理Word导出(略)

app.listen(3000, () => console.log('Server running on port 3000'));

前端(uni-app示例)

uni.request({
    url: 'http://localhost:3000/export/excel',
    method: 'POST',
    data: {
        data: {
            name: '张三'
        }
    },
    success: (res) => {
        const fileUrl = res.data.fileUrl;
        // 可以通过uni-app的downloadFile API下载文件,或者引导用户访问fileUrl下载
        uni.downloadFile({
            url: fileUrl,
            success: (downloadRes) => {
                const tempFilePath = downloadRes.tempFilePath;
                uni.saveFile({
                    tempFilePath,
                    success: () => {
                        console.log('文件保存成功');
                    }
                });
            }
        });
    }
});

注意

  • 服务器端代码需根据实际需求完善,包括错误处理、安全性考虑等。
  • 前端代码中的URL需根据实际情况调整。
  • 文件下载和保存逻辑可能需根据平台差异做适配。
回到顶部