代码:(这里的table代码示例与我另一篇文章中的是一样的,此处不再详细贴了,大家点过去看吧:table) <div style="text-align:center" id="printContent"> <table class="table"> <thead> <tr> <th rowspan="2">序号</th> <th rowspan="2">姓名</th> <th rowspan="2">学号</th> <th rowspan="2...
解决方法2:使用print-js,结合html2canvas,实现打印: 需要注意的是,如果table存在滚动条,就会打印不全了,调整好列宽即可,打印效果图如下 附上全部代码: 1<template>2<div>3<el-card shadow="never" >4<el-button v-print="printObj">nb打印</el-button>5<el-button @click="onPrint">printJs打印</el-b...
步骤三:找到printarea.js的getFormData函数在 return copy 上面添加以下代码 // copy是ele对象的深度拷贝,修改copy对象不会更改页面中table表格的样式,只会更改打印预览生成的表格的样式 const cells = copy.querySelectorAll('.cell'); const tableNode = copy.querySelectorAll('.el-table__header,.el-table__...
使用vue-print-nb的API解决打印时的样式问题，通过修改CSS。对于打印不全的问题，需要通过修改源码来解决，可直接将相关文件复制到项目中的assets目录下。任意选择一个文件放入。将上述文件放置到assets目录，确保在引入时能够正确加载。在main.js中移除之前引入的vue-print-nb代码，避免冲突。在代码中添加be...
1. Re:解决vue-print-nb打印el-table,不同分辨率下,打印显示不全的问题 @QinHaoRan 你这页面应该有滚动条,纵轴打印不全吧,调试下这块的代码:... --scallop 2. Re:解决vue-print-nb打印el-table,不同分辨率下,打印显示不全的问题 大佬,为啥我的页面,其实已经打印不下来,但是,浏览器没有自动换页面,而是直接...
利用vue-print-nb对elementui中的table进行打印时,表头和数据列对应的边框没有对齐如何解决?打印前浏览页面:打印后页面:代码: <template> <div class="app-container" id="printDom"> <div class="title">清单</div> <el-button plain size="small" type="warning" v-print="printObj">打印</el-button>...
vue2和vue3使用方法不同,具体如下: https://blog.csdn.net/LizequaNNN/article/details/122438389 vue-print-nb打印elementui的table表格,显示不全(vue2.0解决办法): https://blog.csdn.net/liangyiyiliang/article/details/124451553 https://blog.csdn.net/Kevin_Y4/article/details/125066548 其他解决办法(未测...
以下内容为设置element table在打印时的样式,防止打印不全 @page{size:auto;margin:3mm;}@mediaprint{html{background-color:#ffffff;height:auto;margin:0px;}body{border:solid 1px #ffffff;/* margin: 10mm 15mm 10mm 15mm; */}#print table{table-layout:auto!important;}#print .el-table__header-wrap...
第一部分打印表格表格上效果:步骤一:先安装vue-print-nb依赖,找到node_modules里的print复制一份出来步骤二:把print放到自己想放的地方步骤三:找到printarea.js的getFormData函数在 return copy 上面添加以下代码// copy是ele对象的深度拷贝,修改copy对象不会更改页面中table表格的样式,只会更改打印预览生成的表格的样式...