vue 扫码页面限制区域_vue项目-打印页面中指定区域的内容(亲测有效!)

本文介绍如何在Vue项目中实现打印页面时只打印指定区域,通过点击打印按钮时隐藏不需要打印的内容,保持打印样式,详细展示了实现方法和思路。
摘要由CSDN通过智能技术生成

关于打印整个页面的,没什么好说的。今天我给大家分享一个打印指定区域的方法,你想打印哪里,就打印哪里!

我也是刚刚开始接触打印这一块功能的,然后当然是找度娘深入了解了一番啦,期间试了网上的各种方法,有的压根就没效果;

有的可以实现打印部分区域的页面,但是在打印界面会丢失样式,那样子界面会很丑;下面我会列出网上的部分方法,以及我的方法。(插件我没有试过~)

网上方法一:(该方法我在vue页面使用没有做到指定区域打印,而是打印全部)

1530706435ee7cb7cd9c62d024944e34.png

网上方法二:(该方法我在vue页面使用可以做到打印部分区域,但是样式会丢失)

a9a07dc0b0596a3d9dfcd6ac156b1aa1.png

我的实现方法:

打印前的页面

79db6e1038d9941a67d44e3bf5c44c6b.png

点击打印按钮后的页面

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值