解决vue-print-nb打印时多出一页空白,vue-print-nb打印有空白页

news2025/1/18 14:48:36

项目场景:

提示:这里简述项目相关背景:

打印table表格,需要用到vue-print-nb插件,使用该插件可以一键弹窗打印页面
效果如图
在这里插入图片描述
在这里插入图片描述


问题描述

提示:这里描述项目中遇到的问题:

查了一下,别人说原因是html的height高度给了100%
但是项目已经写了很多了,而且是基于若依框架来的,怕出问题,就没有去注释高度百分百
参考文章:解决vue-print-nb每次打印都会多出一张空白页


解决方案:

提示:这里填写该问题的具体解决方案:

参考文章:vue 使用vue-print-nb组件打印时出现一张空白页

这个是写在vue项目中

<style media="print">
@page {
    size: auto;
    margin: 3mm;
}

html {
    background-color: #ffffff;
    height: auto;
    margin: 0px;
}
</style>

在这里插入图片描述

如果打印时有不需要的东西,在它的标签里写上class为hidden就好了,点击打印时就会隐藏


打印内容案例

在这里插入图片描述

不会用vue-print-nb的参考如下教程

【Vue】vue2导出页面内容为pdf文件,自定义选中页面内容导出为pdf文件,打印选中页面内容,预览打印内容
在这里插入图片描述
最后面那个就是vue-print-nb的使用教程

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.coloradmin.cn/o/435068.html

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈,一经查实,立即删除!

相关文章

斩获“双金”!玻色量子在中国移动第七届创客马拉松大赛脱颖而出

​4月7日&#xff0c;中国移动第七届创客马拉松大赛总决赛在厦门圆满落幕。此次大赛以“能力无界 智算同行”为主题&#xff0c;经过近4000个创新项目的层层选拔&#xff0c;玻色量子凭借“相干量子计算设备”项目脱颖而出&#xff0c;成功摘取“双金”&#xff1a;总决赛全球通…

Qt5.12实战之菜单栏工具栏与状态栏使用

演示效果: 1.widget工程创建 2.ui设计 双击打开下图所示的.ui文件 菜单设计: 添加子菜单 修改QMenu及QAction对象名称为可识别名 具体修改操作如下: QMenu和QAction类似 在QAction列表中修改QAction对象 具体修改方法如下: 为QAction也就是菜单项目添加点击事件处理: 选择信号…

公网远程访问连接Minecraft我的世界服务器 - MCSM控制面板

文章目录 概述1.MCSManager 安装2.内网穿透2.1 安装cpolar内网穿透 3. 访问公网地址4.固定公网地址4.1 保留一个二级子域名4.2 配置固定二级域名4.3 访问固定公网地址 5. 设置节点公网地址6. 固定节点公网地址6.1 保留一个固定tcp地址6.2 配置固定TCP地址 概述 MCSManager 是一…

After Effects 2022(AE 2022)forMac/win图文安装教程

After Effects简称“AE”是Adobe公司推出的一款图形视频处理软件&#xff0c;适用于从事设计和视频特技的机构&#xff0c;包括电视台、动画制作公司、个人后期制作工作室以及多媒体工作室。属于层类型后期软件。可以帮助您高效且精确地创建无数种引人注目的动态图形和震撼人心…

NPDP认证|B端产品经理是如何做竞品调研的?

做竞品的目的主要是为了对比和测试。 对方比我好的地方我规避&#xff0c;发挥我自己的产品优势&#xff0c;对方差的地方我要切入&#xff0c;把他打败。 通过竞品分析后&#xff0c;企业可以确定我们进入市场的机会&#xff0c;也为后期进行产品测试提供有效的分析依据。 那么…

9.4 数组的指针和指向数组的指针变量-1

9.4 数组的指针和指向数组的指针变量-1 一.指向数组元素的指针变量的定义和赋值二.通过指针引用数组元素1.情况12.情况23.情况34.情况45.情况5注意事项&#xff1a; 情况6&#xff1a;*p 优先级相同&#xff0c;并且都是从右到左的结合性&#xff0c;所以 *(p)情况7&#xff1a…

Maven(四):Maven的使用——java工程与Web工程

Maven&#xff08;四&#xff09;&#xff1a;Maven的使用&#xff08;中&#xff09; 前言一、实验四&#xff1a;创建 Maven 版的 Web 工程1、说明2、操作3、生成的pom.xml4、生成的Web工程的目录结构5、创建 Servlet5.1 在 main 目录下创建 java 目录5.2 在 java 目录下创建…

备受瞩目的南卡OE Pro上线!稳坐国内开放式蓝牙耳机TOP1,舒适音质双在线!

4月10号&#xff0c;国内专业资深声学品牌Nank南卡&#xff0c;将推出2023年度旗舰机——南卡OE Pro不入耳开放式蓝牙耳机&#xff0c;致力打造全新不入耳、不伤耳、安全健康佩戴体验&#xff0c;无论是音质体验还是佩戴舒适度&#xff0c;都完胜同行业不入耳开放式耳机&#x…

Ubuntu系统设置中文

在工作中有时候需要&#xff0c;设置系统编码为中文编码&#xff0c;记录一下配置中文编码的流程 ubuntu所需的安装包&#xff1a;(3条消息) linux中文编码locale资源-CSDN文库 date可以查看是否设置了中文编码 date 没有设置中文编码时是这样的显示格式 将包解压了&#xf…

美颜sdk的性能测试与优化技巧

在移动应用中&#xff0c;美颜功能已成为不可或缺的一部分。美颜sdk作为实现美颜功能的关键技术之一&#xff0c;其性能测试与优化显得尤为重要。本文将介绍美颜sdk的性能测试与优化技巧&#xff0c;希望能给您解答疑惑。 一、性能测试 1、常用性能指标 美颜sdk的性能测试主…

智慧医院微信小程序定制开发功能有哪些

无论是哪个时代&#xff0c;人们对于医疗资源的需求都没有消退过&#xff0c;尤其是随着经济条件的提高&#xff0c;人们也越来越关注健康问题。无论是生病就诊还是定期体检都要用到医疗资源。但是平时到医院好像什么时候都人满为患&#xff0c;排很长时间的队&#xff0c;不仅…

数字乡村振兴智慧农业整体规划建设方案2022(ppt可编辑)

项目建设需求 1、农业遥感应用&#xff1a;土地资源分布情况、农作物种植品类分析、作物种植面积监测及区域规划、农作物长势动态监测、农作物估产、病虫害的监测及预警。2、测土配方施肥系统&#xff1a;可查询到相关土地的土壤信息&#xff0c;如&#xff1a;土壤类型、养分…

【顺序表】

顺序表和链表 顺序表1. 函数声明部分2. 函数的实现部分&#xff08;1&#xff09;初始化&#xff08;2&#xff09;尾插&#xff08;3&#xff09;头插&#xff08;4&#xff09;尾删&#xff08;5&#xff09;头删&#xff08;6&#xff09;在pos位置插入x&#xff08;7&#…

【Python实战】入门级都能学懂的Python爬虫之仅需8行代码一键免费下载音乐,听歌自由真这么简单?

前言 据说互联网上 50%以上的流量都是爬虫创造的&#xff0c;也许你看到很多热门数据都是爬虫所创造的&#xff0c; 所以可以说无爬虫就无互联网的繁荣。 所有文章完整的素材源码都在&#x1f447;&#x1f447; 粉丝白嫖源码福利&#xff0c;请移步至CSDN社区或文末公众hao即…

C语言的深度解析

C语言的深度解析 C语言概述C语言内存管理C语言标准库 C语言概述 C是一种通用的、过程式编程编程语言&#xff0c;支持结构化编程、词法作用域和递归&#xff0c;使用静态类型系统&#xff0c;并且广发用于系统软件与应用软件的开发。 C语言具有高效、灵活、功能丰富、表达力强…

EMQX vs NanoMQ | 2023 MQTT Broker 对比

引言 EMQX 和 NanoMQ 都是由全球领先的开源物联网数据基础设施软件供应商 EMQ 开发的开源 MQTT Broker。 EMQX 是一个高度可扩展的大规模分布式 MQTT Broker&#xff0c;能够将百万级的物联网设备连接到云端。NanoMQ 则是专为物联网边缘场景设计的轻量级 Broker。 本文中我们…

基于MATLAB语音信号的数字滤波

MATLAB语音信号的数字滤波 一、实验目的 掌握使用 FFT 进行信号谱分析的方法设计数字滤波器对指定的语音信号进行滤波处理 二、实验内容 导入音频信号&#xff0c;并绘制出时域波形和频域波形&#xff1a; 可以看到&#xff0c;频谱上有很多额外的噪音频率&#xff0c;在…

智加科技与舍弗勒签订商用车先进转向系统量产合作协议,将率先量产行业首个正向开发的智能重卡冗余转向

自动驾驶已经成为当前汽车行业的重要发展趋势之一。在此背景下&#xff0c;在2023上海国际汽车展期间&#xff0c;智加科技与舍弗勒集团签订量产合作协议&#xff0c;双方将在自动驾驶商用车先进转向系统领域展开合作&#xff0c;共同推动重卡自动驾驶的技术应用和创新发展。 图…

用TrackEval评测自己的数据集

TrackEval库虽然很专业&#xff0c;但是设置路径很麻烦&#xff0c;于是我自己基于TrackEval简单写了个对评测自己数据集更友好的&#xff0c;仅限2DMOT数据集&#xff0c;可以评测多类别。 项目地址&#xff08;欢迎star&#xff01;&#xff09;https://github.com/JackWoo0…

第三十天 Maven高级(分模块设计、继承、聚合、私服)

目录 Maven高级 1. 分模块设计与开发 1.1 介绍 1.2实践 1.3 总结 2. 继承与聚合 2.1 继承 2.2 聚合 2.3 继承与聚合对比 3. 私服 3.1 场景 3.2 介绍 3.3 资源上传与下载 Maven高级 Web开发讲解完毕之后&#xff0c;我们再来学习Maven高级。其实在前面的课程当中&am…