引入组件
<script src="https://printjs-4de6.kxcdn.com/print.min.js"></script>
<script src="https://printjs-4de6.kxcdn.com/print.min.css"></script>
前端:
<el-table id="printCons"
按钮触发
<el-button icon="el-icon-printer" @click="myPrint()">打印 </el-button>
myPrint() {
printJS({
printable: "printCons", // 'printFrom', // 标签元素id
type: 'html',
header: '表格名字',
headerStyle: 'text-align:center;color:#000;width:100%;',
scanStyles: false,
style: 'table{table-layout: auto;border-collapse:collapse;} ' +
'table tr td,th { padding:10px;border:1px #000 solid; white-space:normal;word- break:break-all; text-align:center}' +// 表格样式
'margin:auto 0mm;'
})
},
已经成功打印。
但是出现了表格打印不全问题:
解决方法:下一篇文章