vue打印window.print( )打印方法使用

直接调用window.print()方法会默认打印页面中body里的所有内容。有时候是不需要打印页面body里的所有内容的，而只是想打印一部分指定内容。接下来代码是重点

事件监听 

有两个事件可以监听到到打印事件，一个是beforeprint,一个是afterprint，分别表示打印事件触发前后。
这个事件在 IE6 就已经支持了，兼容大概是 Firefox、IE全支持, Chrome63+支持, Safari暂不支持

我们可在处理事件onbeforeprint() 将一些不需要打印的元素隐藏，和打印后的处理事件 onafterprint()放开隐藏的元素

 网上看这两个事件中可以去做一些操作，比如设置打印内容的一些样式做一些调整，但是我的代码没有在这两个事件中写也是生效的。如下是我的代码

 对form-bottom这个DOM元素打印前做了隐藏，以及给'NumStyle '  这个DOM字体颜色做了调整。

设置打印布局（横向、纵向、边距）

 去除浏览器默认页眉页脚

页眉打印默认有页眉页脚信息，展现到页面外边距范围，我们可以通过去除页面模型page的外边距，使得内容不会延伸到页面的边缘，再通过设置 body 元素的 margin 来保证 A4 纸打印出来的页面带有外边距。

 参考文章链接   vue、js 打印 window.print（）方法_gu_eu的博客-CSDN博客