首页 > 其他分享 >vue2导出word文件

vue2导出word文件

时间:2022-11-18 10:27:39浏览次数:55  
标签:文件 word name 导出 vue2 error import docxtemplater 模板

安装依赖

cnpm install --save docxtemplater pizzip  jszip-utils file-saver

模板文件(模板文件中使用 {name} ,‘{name}’ 将会被替换成 ‘张三’)

test.docx 放在public目录下(vue2)

导入

import PizZip from "pizzip";
import JSZipUtils from "jszip-utils";
import docxtemplater from "docxtemplater";
import saveAs from "file-saver";

使用

print() {
      // 读取二进制模板文件
      JSZipUtils.getBinaryContent("test.docx", function (error, content) {
        if (error) {
          throw error;
        }
        let zip = new PizZip(content);
        // 创建并加载docxtemplater实例对象
        let doc = new docxtemplater().loadZip(zip);
        // 设置模板变量的值
        doc.setData({
          name: "张三",
        });
        console.log(zip);

        try {
          // 用模板变量的值替换所有模板变量
          doc.render();
        } catch (error) {
          // 抛出异常
          let e = {
            message: error.message,
            name: error.name,
            stack: error.stack,
            properties: error.properties,
          };
          console.log(JSON.stringify({ error: e }));
          throw error;
        }
        // 生成一个代表docxtemplater对象的zip文件(不是一个真实的文件,而是在内存中的表示)
        let out = doc.getZip().generate({
          type: "blob",
          mimeType:
            "application/vnd.openxmlformats-officedocument.wordprocessingml.document",
        });
        // 将目标文件对象保存为目标类型的文件,并命名
        saveAs(out, "报价单.docx");
      });
      return false;
    },

 

标签:文件,word,name,导出,vue2,error,import,docxtemplater,模板
From: https://www.cnblogs.com/jqynr/p/16902300.html

相关文章

  • C# word 替换
    privatevoidCreateOneRiZhi(stringnewPath,stringtheDate,stringinfo){System.IO.File.Copy(System.Windows.Forms.Application.StartupPat......
  • Global Mapperv17 裁剪dem并导出等高线
    1、加载dem数据数据投影2、加载shp范围3、选中范围数据4、裁剪5、生成等高线6、导出等高线矢量......
  • .NET实现 导出带超链接的Excel数据
    usingFile4._5.model;usingNPOI.HSSF.UserModel;usingNPOI.SS.UserModel;usingNPOI.XSSF.UserModel;usingSystem;usingSystem.Collections.Generic;usingSys......
  • 【select 语句】 into outfile 【导出文件名 】【导出参数】fields terminated by 'st
    【导出参数】fieldsterminatedby'str':设置字段之间的分隔符,默认值是"\t"。fieldsenclosedby'char':设置包括住字段的值的符号,如单引号、双引号等,默认情况下不使用......
  • WordPress编辑器支持ppt一键粘贴
    ​ ueditor粘贴不能粘贴word中的图片是一个很头疼的问题,在我们的业务场景中客户要求必须使用ueditor并且支持word的图片粘贴,因为这个需求头疼了半个月,因为前端方面因为安......
  • WordPress编辑器支持ppt一键导入
    ​ 当前功能基于PHP,其它语言流程大致相同 1.新增上传wordjson配置在ueditor\php\config.json中新增如下配置:     /* 上传word配置 */    "wordAction......
  • WordPress编辑器支持ppt一键上传
    ​ 百度ueditor新增的将word内容导入到富文本编辑框的功能怎么没有啊,...ueditor实现word文档的导入和下载功能的方法:1、UEditor没有提供word的导入功能,只能说是粘贴复......
  • phpmyadmin 数据库导出数据到excel(图文版)
    查询到想要的数据后,点击上方或下方的“导出”按钮格式选择“CSVforMSExcel” 如果快速导出的数据乱码,可以选择“导出方式”->“自定义-显示所有可用的选项”。......
  • WPS宏编辑器批量设置word中表格样式
    设置表格占用宽度比例并自适应页面宽度/***表格自适应*/functiontableAutoFitWindow(){ varcount=ActiveDocument.Tables.Count; for(i=1;i<=count;i......
  • WordPress编辑器支持ppt自动导入
    ​图片的复制无非有两种方法,一种是图片直接上传到服务器,另外一种转换成二进制流的base64码目前限chrome浏览器使用首先以um-editor的二进制流保存为例:打开umeditor.js,......