1、安装vue-print-nb插件 npm install vue-print-nb --save 2、main.js中引用 import Print from 'vue-print-nb' Vue.use(Print) //注册 3、页面源码(复制粘贴即可) <template> 立即打印 <!-- 这句话很重要,如果通过display:none控制显隐会导致点击打印按钮生成空白--> <!--每一页的具体内容-...
假如我们想实现,在打印的时候改变样式,或者隐藏一些不需要打印的元素,直接使用上面的方法就不能实现 需要进行如下修改 (1)把vue-print-nb的文件夹放到自己的文件夹中,在src 下新建utils文件 里面放入src 和index.js src里面是print.js 和printarea.js index.js和print.js是自定义指令有关的,我们需要的只是printare...
(1)打印隐藏内容 在打印弹框中需求显示查看的内容,但是在打印的时候需要隐藏,不打印显示 print4.png (2)打印单据有2个以上,打印时需要自动分页打印 在一个打印弹框中显示所有的打印单据,但在打印时需要自动分页打印 有多个单据时,可以循环展示,在单据内容的最外层的div设置样式page-break-after:always,即可在打印...
安装npm install vue-print-nb --save 在main.js文件中注册 import Print from 'vue-print-nb' 1. Vue.use(Print); 1. 页面中使用,给需要打印的容器加一个id,打印按钮传入这个id html: 葫芦娃,葫芦娃 一根藤上七朵花 小小树藤是我家 啦啦啦啦 叮当当咚咚当当 浇不大 叮当当咚咚当当 是我家 啦啦...
打印插件:vue-print-nb Node版本:v16.20.2 第一步、安装依赖 npm install vue-print-nb 1. 第二步、引入插件 /** * main.js / import Vue from 'vue' import Print from 'vue-print-nb' Vue.use(Print) 1. 2. 3. 4. 5. 6. 第三步、代码编写 ...
在网上找了一个打印组件vue-print-nb 本博客源码:https://github.com/shengbid/vue-print,这里面只放了打印组件的代码,只需要这个功能的下载这个 https://github.com/shengbid/vue-demo这个项目里平时博客写的一些功能的代码都放在里面,有需要可以下载看看,有帮助的话点个star哈 ...
这个是介绍的vue3-print-nb插件的视频,简单的打印功能可以简单实现代码不放了,看视频抄代码吧,嗯呢 很刺激,太长了,懒得剪了,虽然短版也没剪, 视频播放量 2041、弹幕量 2、点赞数 12、投硬币枚数 6、收藏人数 22、转发人数 4, 视频作者 铁憨憨的小小白, 作者简介 雨,
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-element 与 vue-print-nb 两款插件类似,都是基于 Vue 实现打印功能。 在电脑端调用打印机正常: Huawei MatePad Air 端调用打印机失效: 原来设置了只打印弹框中的表格部分内容,实际上却将整个浏览器 tab 页进行打印。 取巧的做法的思路: ...
1、npm install vue-print-nb --save 二、引入Vue项目 在main.js中添加-- 全局挂载 import Print from 'vue-print-nb' Vue.use(Print) 三、前端代码 一、操作项中的打印按钮 <svg-icon icon-class="printer"class="svgicon"@click="showPrinterDialog(scope.row)"/> 二、打印组件 <!--...