使用vue-print-nb // 被打印的容器 这块内容将会被打印 // 打印按钮绑定 printObj <el-button v-print="printObj">打印</el-button> // 在数据data中添加 printObj: { id: 'printMe', // 这里是要打印元素的ID popTitle: ' ', // 打印的标题 extraCss: '', // 打印可引入外部的一个 css 文...
针对你提到的vue-iframe-print打印不全的问题,以下是一些可能的解决方案和排查步骤,希望能帮助到你: 1. 检查并确认vue-iframe-print的使用方法和配置是否正确 首先,确保你已经正确安装并引入了vue-iframe-print,并且按照其文档或示例代码进行了配置。例如,确保你已经为需要打印的内容指定了正确的ID,并且在调用打印函数...
2.1首先看能不能从element 着手,但是element 的table有设置Table-column Attributes 的width属性 但是是px不是百分百。 2.2既然element不行 那就从vue-print-nb 着手,首先 我们要清楚print的原理其实就是将我们要打印的id包裹的内容(其实是生成图片)放到一个iframe 然后再打印。那我们就走打印之前修改这些table>colgro...
1、将vue项目node-modules中的vue-print-nb/print文件夹下的所有内容拷贝出来，放到项目中。我这里是放到了src/assets/vue-print-nb目录下。2、修改拷贝的源码printarea.js中getBody()返回的。添加样式：style="height:auto"。3、修改main.js中的引用。解决。遗留问题：打印预览的最底部出现空白页，一般是由于margi...
1、用的是vue.js vue-print.js2、打印的html,我是直接通过js来拼接的字符串,因为vue-print插件要求是object(DOM),就另外创建了一个div,然后将字符串给这个div,再获取这个div的html。 尝试过的方法:1、直接改table的宽度,发现默认情况下,table的最大宽度设置成1175px就可以正常打印,再大右边就会缺失。但是这样...
解决方法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-print依赖。2. 在main.js中导入Vue-print插件并使用。3. 在HTML中添加打印按钮，使用v-print指令，指定打印区域，例如打印表格。4. 定义一个用于打印的HTML区域。考虑到表格生成的页面不够美观，采用ant-design-vue的格栅系统处理页面布局。印章的样式需精细调整，包括弧度、文本居中偏移...
使用vue-print-nb 打印table,数据是后端接口返回的动态数据,当时数据很多时,打印预览的表格还是只有一页,如下图:数据太多,中间省略未截图。打印预览如下,只有一页: 代码:(这里的table代码示例与我另一篇文章中的是一样的,此处不再详细贴了,大家点过去看吧:table) 序号 姓名 学号 性别 班级 {{it}} ...
技术标签:vue.jsprint.js 首先网上已经有很多使用步骤,比如 https://www.jianshu.com/p/c5363ddf7d43 相关链接:pringt.js github地址 里面也有使用说明 主要记录以下使用时发现的问题: 1.样式问题 我使用的element组件,发现分栏布局 xs\md\lg没有效果。我想大概这种组件封装的样式使用都有点问题。从这思路去入...