前言
在前端开发工作中，有时我们需要将页面内容输出为 PDF 或图片等格式，而利用浏览器的打印功能是一种简单有效的实现方式。在打印时，开发者可以通过 JavaScript 控制页面内容的展示，但是对于页面的样式等细节却往往难以精准控制。针对这个问题，npm 社区提供了一个名为 "print-job" 的 npm 包，可以让我们更方便地进行打印控制，下面将为大家详细介绍该包的使用方法。
安装 print-job
安装 print-job 的方式非常简单，只需要在命令行中执行如下语句即可：
npm install print-job --save-dev
使用 print-job
导入 print-job
首先需要将 print-job 导入到项目中：
import PrintJob from 'print-job';
准备打印内容
之后，我们需要准备好需要打印的内容。如果需要打印的是页面 DOM 元素，可以通过以下方式获取元素：
const printContent = document.getElementById('printContent');
如果需要打印的是图片，则需要在页面中插入图片元素，然后通过以下方式获取图片路径：
const printContent = document.getElementById('printImg').getAttribute('src');
实例化 PrintJob
接下来，我们需要实例化 PrintJob，并设置打印参数：
const printJob = new PrintJob({ title: document.title, pageWidth: '210mm', pageHeight: '297mm', pageOrientation: 'portrait', mimeType: 'application/pdf', });
title：打印页面的标题；pageWidth：页面宽度；pageHeight：页面高度；pageOrientation：页面方向，可选值包括 portrait 和 landscape；mimeType：打印输出的 MIME 类型，可选值包括 application/pdf 和 image/png 等。
开始打印
在打印之前，我们可以通过以下方式设置打印的页面内容：
printJob.setContent(printContent);
其中，printContent 可以是需要打印的 DOM 元素或图片路径。
接下来，我们调用 print() 方法进行打印：
printJob.print();
完整示例
-- -------------------- ---- ------- ------ -------- ---- ------------ -- -------------- ----- ------------ - ------------------------------------------------------------ -- --- -------- ----- -------- - --- ---------- ------ --------------- ---------- -------- ----------- -------- ---------------- ----------- --------- ------------------ --- -- ------ ---------------------------------- -- -- -----------------展开代码
总结
通过使用 print-job 包，我们可以更方便地进行页面打印控制，同时可以更细致地设置打印参数，保证打印效果的精准性。同时，在实际的开发过程中，还可以根据具体需求，灵活地调整打印参数，满足不同的打印需求。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/6005590881e8991b448d6638
