uniapp 页面转换成pdf

chen19911127

已于 2024-06-27 09:44:42 修改

阅读量199

点赞数 2

文章标签：前端 javascript html

于 2024-06-27 09:37:22 首次发布

本文链接：https://blog.csdn.net/u014308207/article/details/140004663

版权

uniapp 页面转换成pdf。
“html2canvas”: “^1.4.1”,
“jspdf”: “^2.5.1”,

		const content = document.querySelector('#content').innerHTML; // 需要转换为PDF的DOM元素
			  const innerHtml = `
			          <head>
			        <title>Print</title>
			    
			      </head>
			      <body>
			        ${content}
			      </body>
			      `
		html2canvas(innerHtml, {
		        allowTaint: true
		      }).then(function (canvas) {
		        let contentWidth = canvas.width
		        let contentHeight = canvas.height
		        let pageHeight = contentWidth / 592.28 * 841.89
		        let leftHeight = contentHeight
		        let position = 0
		        let imgWidth = 595.28
		        let imgHeight = 592.28 / contentWidth * contentHeight
		        let pageData = canvas.toDataURL('image/jpeg', 1.0)
				let PDF = new jsPDF('', 'pt', 'a4')
		        if (leftHeight < pageHeight) {
		          PDF.addImage(pageData, 'JPEG', 0, 0, imgWidth, imgHeight)
		        } else {
		          while (leftHeight > 0) {
		            PDF.addImage(pageData, 'JPEG', 0, position, imgWidth, imgHeight)
		            leftHeight -= pageHeight
		            position -= 841.89
		            if (leftHeight > 0) {
		              PDF.addPage()
		            }
		          }
		        }
				//console.error(PDF.output('blob'), 'HHHH')
		        PDF.save('output.pdf')
		})