我在 ReactJS 组件中使用 html2canvas 和 jsPDF 库将表格导出到 PDF 文件。但是,我遇到了一个问题,即表格太长,无法容纳在单个页面中,导致它被切断并且在生成的 PDF 中不完全可见。
如果表格太长,我想将表格分成多页。
处理导出的函数。
const pdfRef = useRef()
const exportPDF = () => {
const input = pdfRef.current;
html2canvas(input).then((canvas) => {
const imgData = canvas.toDataURL('image/png')
const pdf = new jsPDF('l', 'mm', 'a4', true);
const pdfWidth = pdf.internal.pageSize.getWidth();
const pdfHeight = pdf.internal.pageSize.getHeight();
const imgWidth = canvas.width;
const imgHeight = canvas.height;
const ratio = Math.min(pdfWidth / imgWidth, pdfHeight / imgHeight);
const imgX = (pdfWidth - imgWidth * ratio) / 2;
const imgY = 0;
pdf.addImage(imgData, 'PNG', imgX, imgY, imgWidth * ratio, imgHeight * ratio);
pdf.save('peerss-employees.pdf')
})
}
我收到的PDF被第8行截断了,但实际上有23行: