vue3 vben admin +ts + printJS 打印 的三种方式

安装

To install using npm:


  npm install print-js --save

To install using yarn:


  yarn add print-js

最近的新需求，是打印表格 查了好多地方，然后总结了三种方法

无论哪种方式都需要下载 然后引入

地址：https://printjs.crabbly.com/

   import printJS from 'print-js';

方法一：主要是打印页面上的所有东西  ，页面有什么他就打印什么，标签除外，但是 这个没有选择性，

print包裹在哪就从哪里开始进行渲染

效果展示 

 

 -------------------------------------------------------------------------------------------------------------------------------

方法二 ： 这个主要是在下边的打印列表进行数据的导入，然后在进行输出，但是格式相对来说比较固定，你需要在他给你的属性里边定义数据

但是样式相对来说比较固定

效果展示

方式三 ： 在header里边进行定义  然后在里边进行数据的排版修改等 样式相对来说灵活  你可以在里边选择自己需要的样式  内容 然后在进行渲染

效果展示

现在线不是双线吗  如果你想让他变成单线的话，在table后边加上一句

 cellpadding="0" cellspacing="0" style="border-collapse:collapse" 

就可以了

好了三种说完了  欢迎提出不足  也欢迎交流，希望对你有帮助，

------------------------------------------------------------------------------------------------------------------------------

答疑解惑 

调整页面大小编辑  如何进行分页   调整页面布局 纸张等  打开更多设置 根据自己情况调节