在Vue 3项目中使用vue3-print-nb插件时遇到表格打印不全的问题,通常可以从以下几个方面进行排查和解决: 检查vue3-print-nb插件版本和文档: 确保你使用的vue3-print-nb版本是最新的,或者至少是一个稳定版本。可以访问其GitHub仓库或官方文档来查看版本信息和更新日志。 仔细阅读官方文档,特别是关于表格打印的部分,...
而我们需要修改的是iframe的样式,去使table表格能打印完全 3.修改源码。 首先我们要写一些样式覆盖原来的table的宽度样式 确保宽度不是一个具体的px 3.1.先安装 vue-print-nb插件 npm install vue-print-nb--save 解决上述问题因为要改源码,所以在依赖里找到这个文件,单独拿出来,然后再main.js引用一下 image.png...
解决方法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>...
<Button style="margin-left:5px;" type="primary" v-print="'#printContent'">打印</Button> 根据vue-print-nb 的示例,并没有其他的设置了,那为什么当时数据很多时,打印预览的表格还是只有一页?该如何设设置? 看到vue实现打印功能的两种方法说显示不全的设置缩放,但是那么多条数据缩放到一页显示也太小了吧...
使用vue-print-nb 打印table,数据是后端接口返回的动态数据,当时数据很多时,打印预览的表格还是只有一页,如下图:数据太多,中间省略未截图。打印预览如下,只有一页: 代码:(这里的table代码示例与我另一篇文章中的是一样的,此处不再详细贴了,大家点过去看吧:table) 序号 姓名 学号 性别 班级 {{it}} ...
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); //注册 ...
// 引入依赖importPrintfrom'vue-print-nb-jeecg'// 使用插件Vue.use(Print)3. 打印按钮加v-print...