使用 html2pdf.js 实现
npmjs 地址:html2pdf.js
github 仓库地址:html2pdf.js
使用 html2pdf.js 的方法非常简单,只需要能获取到要生成 PDF 的 HTML 元素即可
安装
npm i html2pdf.js
引入
先在需要使用导出的页面引入
import html2pdf from "html2pdf.js";
使用
基本配置,页边距,文件名,生成图片类型和质量等信息,自行调整
具体配置项可以看 npmjs 的 html2pdf.js#Options 或 github 的 html2pdf.js#options
let opt = {margin: [0.5, 0.6],filename: "文件名",image: { type: "jpeg", quality: 0.98 },html2canvas: { scale: 3 },jsPDF: { unit: "in", format: "letter", orientation: "portrait" },
};
基本的保存为 PDF 使用流程,使用 html2pdf 导出方法,设置opt
导出配置,从node
导出节点,保存
其他的工作流的方法可以看 npmjs 的 html2pdf.js#worker-api 或 github 的 html2pdf.js#worker-api
html2pdf().set(opt).from(node).save();
手动分页
在导入的节点内加入下面代码手动分页,在哪个节点后加表示在哪分页
<div class="html2pdf__page-break"></div>