当前位置: 代码迷 >> 综合 >> Vue+elemnet UI table表格使用print.js打印
  详细解决方案

Vue+elemnet UI table表格使用print.js打印

热度:62   发布时间:2024-01-21 01:12:39.0

1.npm 安装priint.js

2.vue页面引用

import * as Printjs from "print-js";

3.

<el-tableid="printCons":data="tableData"stripestyle="width: 100%; margin-top: 30px"borderv-loading="loading"><el-table-column prop="locationNumber" :label="$t('table.location')"></el-table-column>.............省略//打印按钮<button class="btn_screen" @click="goPrint">打印</button>

4.

goPrint() {console.log("打印");Printjs({printable: "printCons", //要打印内容的idtype: "html", header:"库存明细",headerStyle: 'text-align:center;color:#000;width:100%;border:1px #000 solid;',scanStyles: false,style: 'table{table-layout: fixed;border-collapse:collapse;} table tr td,th { padding:15px;border:1px #000 solid; white-space:normal;word-break:break-all; text-align:center}' // 表格样式});},

  相关解决方案