安装vue-print-nb依赖 npm install vue-print-nb --save 使用 <!-- 强制分页 --> 打印的内容 打印 data() { return { printObj: {//打印 id: "printTest", popTitle: "标题", extraHead: '', openCallback (vue) {}, closeCallback (vue) {}, }, 强制分页 ...
<el-button type="primary" v-print="printObj">打印</el-button> //绑定v-print 4.data中 data() {return{printObj:{ id:"printMe",//打印区域 Dom IDpopTitle:'打印页面标题文字',//打印的标题extraCss:'',//打印可引入外部的一个css文件extraHead:', #printMe { height: auto !important; } ...
<el-button id="printBtn" v-print="printProps" style="margin-bottom: 10px">打印</el-button> <!-- 打印内容 --> 工单数:{{ data.length }},工单数量:{{ data.reduce((sum, data) => sum + data.workOrderQuantity, 0) }},已生产数量:{{ data.reduce((sum, data) => sum + data.pro...
一、安装vue-print-nb 没有什么前提要求,直接安装即可,但因为Vue2.0和Vue3.0有着不同的用法,因此需要安装的版本也不同,各位看官自行取舍。 Vue2.0版本安装方法: npminstall vue-print-nb --saveyarnadd vue-print-nb Vue3.0版本安装方法: npm install vue3-print-nb --save yarn add vue3-print-nb 二、引...
打印测试 <el-button v-print="'#printTest'">打印</el-button> 假如我们想实现,在打印的时候改变样式,或者隐藏一些不需要打印的元素,直接使用上面的方法就不能实现 需要进行如下修改 (1)把vue-print-nb的文件夹放到自己的文件夹中,在src 下新建utils文件 里面放入src 和index.js src里面是print.js 和pri...
“vue print nb”很可能指的是在Vue项目中使用vue-print-nb或vue3-print-nb插件来实现打印功能。 “连续打印”则意味着需要实现多次打印操作,而不仅仅是打印一次。 查找或开发Vue中实现打印功能的插件或方法: 我们可以使用vue-print-nb或vue3-print-nb插件来实现基本的打印功能。 对于连续打印,我们需要在代码中...
使用vue-print-nb 打印table,数据是后端接口返回的动态数据,当时数据很多时,打印预览的表格还是只有一页,如下图:数据太多,中间省略未截图。打印预览如下,只有一页:
简介: vue 打印vue-print-nb 安装配置 npm install vue-print-nb --save main.js中 // 导入打印插件 import Print from 'vue-print-nb' Vue.use(Print); .vue页面中使用 打印内容 <el-button type="primary" v-print="'printConfig'">打印</el-button> data中定义变量 printConfig:{ id:'print...
Vue.use(Print) 局部引入是在组件里 import Print from 'vue-print-nb' 同时自定义一个指令 (这个好像不用加也得) directives: { Print }, 第三步: 使用 给你打印的内容加上一个id,例如打印表格就是 <template> <v-simple-table id="printTable"> ...
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)"/> 二、打印组件 <!--...