import html2Canvas from 'html2canvas' import jsPDF from 'jspdf' export const exportToPDF = async (elementId: string, filename = 'document.pdf') => { const element = document.getElementById(elementId) if (!element) return await html2Canvas(element, { useCORS: true, allowTaint: true, logging: false, scale: 2, backgroundColor: '#fff', }).then((canvas: any) => { const pdf = new jsPDF('p', 'mm', 'a4') const pageWidth = 190 // 保留边距后的有效宽度 const pageHeight = 277 // 保留边距后的有效高度 //A4大小,210mm x 297mm,四边各保留10mm的边距,显示区域190x277 const imgHeight = (pageHeight * canvas.width) / pageWidth let renderedHeight = 0 while (renderedHeight < canvas.height) { const pageCanvas = document.createElement('canvas') pageCanvas.width = canvas.width pageCanvas.height = Math.min(imgHeight, canvas.height - renderedHeight) pageCanvas .getContext('2d')! .putImageData( canvas .getContext('2d')! .getImageData( 0, renderedHeight, canvas.width, Math.min(imgHeight, canvas.height - renderedHeight), ), 0, 0, ) pdf.addImage( pageCanvas.toDataURL('image/jpeg', 1.0), 'JPEG', 10, 10, // 左边距和上边距 pageWidth, Math.min(pageHeight, (pageWidth * pageCanvas.height) / pageCanvas.width), ) renderedHeight += imgHeight if (renderedHeight < canvas.height) { pdf.addPage() } } pdf.save(filename) }) }