标签：cli inter his top amp win document back 项目
前提：项目中要打印的二维码为后台返回，批量选择后，点击打印，先打开二维码预览界面，再执行打印。
以下代码中 codePicList为选中的二维码数组。
重点css:page-break-after:always 在元素后插入分页符;
在打印时，要分页（需求是每个二维码打印在一张纸上）
// 此代码为浏览界面遍历出来的要打印的多个二维码
<ul id="codeImgviewer" v-if="codePicList != null && codePicList.length != 0"> <li v-for="(item,index) in codePicList" v-bind:key="index" style="cursor:pointer; padding:10px;float:left"> <div :id="‘codeimg‘ + index" style="page-break-after:always;"> <img :src="item" style="width:260px;height:130px;" @click="showBigImg(‘codeImgviewer‘)" /> </div> </li> </ul>
//打印二维码 printCode() { if (this.codePicList == null || this.codePicList.length == 0) { return; } var newWin = window.open(""); //新打开一个空窗口 for (var i = 0; i < this.codePicList.length; i++) { var imageToPrint = document.getElementById("codeimg" + i); //将要被打印的图片 newWin.document.write(imageToPrint.outerHTML); //将图片添加进新的窗口 } newWin.document.close(); //在IE浏览器中使用必须添加这一句 newWin.focus(); //在IE浏览器中使用必须添加这一句 setTimeout(function() { newWin.print(); //打印 newWin.close(); //关闭窗口 }, 100); },
标签：cli inter his top amp win document back 项目
原文地址：https://www.cnblogs.com/ss977/p/10120651.html
