VUE使用html2canvas和JsPdf完成页面转pdf图片

下载依赖：html2canvas,jspdfnpminstallhtml2canvasjspdf--save新建一个htmlToPdf.js文件//将页面导出为PDF格式importhtml2Canvasfrom'html2canvas'//导入依赖importJsPDFfrom'jspdf'import{Message,Loading//导入UI组件}从'element-ui'让加载；exportdefault{install(Vue,options){Vue.prototype.getPdf=function(){loading=Loading.service({//这里添加加载效果lock:true,text:'正在下载pdf...',background:'rgba(0,0,0,.5)'});lettitle=this.htmlTitle//文件名contentHeight=canvas.height;if(contentWidth===''||contentWidth===undefined||contentHeight===''||contentHeight===undefined){//判断是否转换失败loading.close();Message.error('转换pdf失败，请稍后重试！')}letpageHeight=contentWidth/595\*842letleftHeight=contentHeightletposition=0letimgWidth=595letimgHeight=595/contentWidth\*contentHeightletpageData=canvas.toDataURL('image/jpeg',1.0)letPDF=newJsPDF('','pt','a4')if(leftHeight0){PDF.addImage(pageData,'JPEG',0,position,imgWidth,imgHeight)leftHeight-=pageHeight位置-=842if(leftHeight>0){PDF.addPage()}}}loading.close();//关闭加载效果PDF.save(title+'.pdf')})}}}InmainReferencein.jsimporthtmlToPdffrom'./tools/htmlToPdf'//导出pdfVue.use(htmlToPdf)如何使用方法：调用getPdf('待打印模块ID')方法【不能隐藏滚动条，否则只打印滚动条当前界面】这里是需要打印的模块点击下载exportdefault{data(){return{htmlTitle:'页面导出PDF文件名'}}}问题：我把打印页面的A4比例设置为595*842，但是测试了几台电脑，发现不同分辨率会出现打印页面由于表面比例不同的问题，有些电脑最后会把页面的比例放大，每页少印一部分到下一页的坑里。