1、安装 print-js
安装 print-js。你可以通过 npm 或 yarn 来安装这个库：
npm install print-js
或者
yarn add print-js
2、引入print-js
确保在你的组件或全局样式文件中正确引入了 print-js。
** 全局引入，在main.js中添加下方代码 **
import printJS from 'print-js'
Vue.prototype.printJS = printJS
3、示例
下面是一个简单的例子，展示了如何在 Vue 组件中使用 print-js：
<template><div><button @click="printDiv">打印</button><div id="printContainer"><!-- 这里是你要打印的内容 --><h1>这是要打印的内容</h1><p>更多内容...</p></div></div>
</template><script>
// 局部引入，需要使用的组件引入下方代码即可
// import printJS from 'print-js';export default {methods: {printDiv() {this.printJS({printable:'printContainer',type:'html',maxWidth:'900px',documentTitle: '',scanStyles: false,css: ['/print.css']})}}
}
</script><style scoped>
@import "@/assets/styles/print.css";
</style>
4、注意事项
css: ['/print.css']
这部分代码给引入了打印样式文件，该文件需放在项目【public】文件夹下，与【@import “@/assets/styles/print.css”】引入的样式文件，内容需一致，才能保持打印页面与打印预览页效果一致。
5、打印 PDF 文件、图片等
如果你需要打印 PDF 文件、图片或者其他类型的文档，只需要改变 printable 参数的值以及 type 参数来匹配你要打印的内容类型。例如：
打印 PDF 文件：type: ‘pdf’
打印图片：type: ‘image’
打印远程文档：提供文档的 URL
更多功能
print-js 还提供了许多其他配置选项，如设置打印方向、页边距、扫描线等等。你可以参考 print-js 的官方文档 获取更多信息和高级用法。
