在Vue 3项目中使用vue3-print-nb插件时遇到表格打印不全的问题,通常可以从以下几个方面进行排查和解决: 检查vue3-print-nb插件版本和文档: 确保你使用的vue3-print-nb版本是最新的,或者至少是一个稳定版本。可以访问其GitHub仓库或官方文档来查看版本信息和更新日志。 仔细阅读官方文档,特别是关于表格打印的部分,...
使用vue-print-nb // 被打印的容器 这块内容将会被打印 // 打印按钮绑定 printObj <el-button v-print="printObj">打印</el-button> // 在数据data中添加 printObj: { id: 'printMe', // 这里是要打印元素的ID popTitle: ' ', // 打印的标题 extraCss: '', // 打印可引入外部的一个 css 文...
步骤一:先安装vue-print-nb依赖,找到node_modules里的print复制一份出来 步骤二:把print放到自己想放的地方 步骤三:找到printarea.js的getFormData函数在 return copy 上面添加以下代码 // copy是ele对象的深度拷贝,修改copy对象不会更改页面中table表格的样式,只会更改打印预览生成的表格的样式 const cells = copy....
<Button style="margin-left:5px;" type="primary" v-print="'#printContent'">打印</Button> 根据vue-print-nb 的示例,并没有其他的设置了,那为什么当时数据很多时,打印预览的表格还是只有一页?该如何设设置? 看到vue实现打印功能的两种方法说显示不全的设置缩放,但是那么多条数据缩放到一页显示也太小了吧...
解决方法2:使用print-js,结合html2canvas,实现打印: 需要注意的是,如果table存在滚动条,就会打印不全了,调整好列宽即可,打印效果图如下 附上全部代码: 1<template>23<el-card shadow="never" >4<el-button v-print="printObj">nb打印</el-button>5<el-button @click="onPrint">printJs打印</el-button>...
1、将vue项目node-modules中的vue-print-nb/print文件夹下的所有内容拷贝出来，放到项目中。我这里是放到了src/assets/vue-print-nb目录下。2、修改拷贝的源码printarea.js中getBody()返回的。添加样式：style="height:auto"。3、修改main.js中的引用。解决。遗留问题：打印预览的最底部出现空白页，一般是由于margi...
解决Vue3中使用vue-print-nb打印element表格时遇到的样式问题和打印不全问题，通过以下步骤实现：首先，安装vue-print-nb，确保其功能得到充分利用。在项目的main.js文件中，引入vue-print-nb。使用vue-print-nb的API解决打印时的样式问题，通过修改CSS。对于打印不全的问题，需要通过修改源码来解决，可...
1、print-js 直接传送门吧任意门 2、vue-print-nb(table太多,打印不全问题,直接改用第一种) 1、第一种方法 1,安装 npm install vue-print-nb --save 2,引入 安装好以后在main.js文件中引入 import Print from 'vue-print-nb' Vue.use(Print); //注册 ...
利用vue-print-nb对elementui中的table进行打印时,表头和数据列对应的边框没有对齐如何解决?打印前浏览页面:打印后页面:代码: <template> 清单 <el-button plain size="small" type="warning" v-print="printObj">打印</el-button> <el-table :data="table1" size="mini" border> <el-table-column :pr...