html-to-pdf 使用说明

本库致力于 html 在线导出为 pdf，实现智能分页效果，不会切断文本图片表格等内容，可兼容手机端。本库依赖 html2canvas 和 jspdf，使用 canvas 绘图，请保证使用浏览器对以上库是支持的。

html-to-pdf 示例

html-to-pdf 示例源码地址

安装

# 使用npm
npm i -S @wk-tools/html-to-pdf
# 使用yarn
yarn add @wk-tools/html-to-pdf

用法

// ...
import HtmlToPdf from "@wk-tools/html-to-pdf";

function exportPDF() {
  Loading.show();
  const element = document.getElementById("pdf-container");
  const htmlToPdf = new HtmlToPdf(element, {
    name: "葵花宝典",
  });
  htmlToPdf
    .save()
    .catch(() => {
      Message.error("下载失败");
    })
    .finally(() => {
      Loading.hide();
    });
}

类/属性/方法/参数等说明

HtmlToPdfClass

注意：resetBaseStyle 与 waitForImagesLoaded 包含的重制样式，是因为 html2canvas 在导出图片时，某些样式会与 DOM 元素不一致，故要增加特定样式以达到所见即所得。若是遇到页面所见与导出不一致，请着重思考样式问题。

PdfOptions

HeaderOrFooterOptions

AdaptiveOptions

PdfPlugin

为了方便扩展基础功能，PDF 生成增加了插件机制。插件有 beforeDraw、draw、afterDraw 三个钩子，通过钩子可以增加 PDF 页面，或者在 PDF 页面中增加自定义内容（页眉页脚）。本工具内置了页眉页脚插件，并开放了封面、封底插件，用于用户参考使用。若是有目录或水印需求，可通过插件实现。

SinglePageOptions

封面/底插件

CoverPluginOptions

CoverOptions

License

MIT