vue 3 打印 print-js

 

1、安装

npm install print-js --save

2、引用

import print from 'print-js'

3、编写打印函数

const enterDialog = async () => {
            const style = '@page {margin:0mm 10mm};'//打印时去掉眉页眉尾
                  printJS({
                    printable: 'print',// 标签元素id
                    type: 'html',
                    header: '',
                    targetStyles: ['*'],
                    style
                  });
}

4、调用函数

<table id="print"></table>
<div class="dialog-footer" style="text-align: center; position: absolute;top: 80px;right: 20px;">
      <el-button size="large" @click="enterDialog" style="margin: 5px;">打 印</el-button><br>
      <el-button size="large" @click="closeDialog" style="margin: 5px;">取 消</el-button>
</div>

 

打印最好使用原生table标签，不然可能会出现很大的样式问题