使用CSS在JavaScript (reactJS)中将HTML转成PDF

<script src="https://cdnjs.cloudflare.com/ajax/libs/jspdf/2.5.3/jspdf.umd.min.js"></script>

import React from 'react';
import html2canvas from 'html2canvas';
import jsPDF from 'jspdf';

class HtmlToPdf extends React.Component {
  exportToPdf = () => {
    const input = document.getElementById('html-to-pdf');
    html2canvas(input)
      .then((canvas) => {
        const pdf = new jsPDF('p', 'mm', 'a4');
        const imgData = canvas.toDataURL('image/png');
        pdf.addImage(imgData, 'PNG', 0, 0, 210, 297); // 根据需要设置图像的位置和尺寸
        pdf.save('html-to-pdf.pdf');
      });
  }

  render() {
    return (
      <div>
        {/* HTML内容，设置id为html-to-pdf */}
        <div id="html-to-pdf">
          {/* 在这里放置要转换为PDF的HTML内容 */}
        </div>
        
        {/* 导出按钮 */}
        <button onClick={this.exportToPdf}>导出为PDF</button>
      </div>
    );
  }
}

export default HtmlToPdf;