vue 表格打印

1.写表格

 <div id="print">
                <table border="1" width="600" height="300" cellspacing="0" class="tTable">
                    <tr>
                        <td colspan="7" class="title">山西大学各单位安全隐患排查及整改台账</td>
                    </tr>
                    <tr>
                        <td rowspan="7" class="ltitle">安全隐患排查及整改</td>
                    </tr>
                    <tr>
                        <td class="tlabel">排查时间</td>
                        <td>2023-01-12 14</td>
                        <td class="tlabel">排查部位</td>
                        <td>理化实验室（锅炉房）</td>
                        <td class="tlabel">排查类别</td>
                        <td>Ⅰ级（重大隐患）</td>
                    </tr>
                    <tr>
                        <td class="tlabel">现场处理的隐患:</td>
                        <td colspan="5">11</td>
                    </tr>
                    <tr>
                        <td class="tlabel">现场发现不能立即处理的隐患及采取的防护措施</td>
                        <td colspan="5">1122</td>
                    </tr>
                    <tr>
                        <td class="tlabel">排查负责人签字</td>
                        <td>2023-01-12 14</td>
                        <td class="tlabel">岗位负责人签字</td>
                        <td>理化实验室（锅炉房）</td>
                        <td class="tlabel">单位党政负责人签字</td>
                        <td>排查类别</td>
                    </tr>
                    <tr>
                        <td class="tlabel">彻底整改情况:</td>
                        <td colspan="5">11</td>
                    </tr>
                    <tr>
                        <td class="tlabel">排查整改人签字</td>
                        <td>2023-01-12 14</td>
                        <td class="tlabel">单位党政负责人签字</td>
                        <td>理化实验室（锅炉房）</td>
                        <td class="tlabel">整改时间</td>
                        <td>排查类别</td>
                    </tr>
                </table>
            </div>

2.下载

npm install vue-print-nb
main.js中

import Print from 'vue-print-nb'
Vue.use(Print);

3.打印调用

<el-button type="primary" v-print="printObj">打 印</el-button>

printObj: {
    id: "print", // 这里是要打印元素的ID
    popTitle: "", // 打印的标题
    extraCss: "", // 打印可引入外部的一个 css 文件
    extraHead: "", // 打印头部文字
},