react项目中使用html2canvas截图插件插入pdf

<div className={styles.report} ref={contentRef}>

//要放在截图中的内容

</div>

<Button type='primary' onClick={handlePreview} >截图</Button>

const handlePreview = async () => {

          try {

            const canvas = await html2canvas(contentRef.current!, {

              scale: 3, // 提高截图质量

              scrollX: 0,

              scrollY: 0,

              width: 1834, // 横向A4纸张宽度（单位px）

              height: 1188, // 横向A4纸张高度（单位px）

            });

            const imgData = canvas.toDataURL('image/png');

            // 创建PDF

            const pdf = new jsPDF('l', 'mm', 'a4');

            pdf.addImage(imgData, 'PNG', 5, 5,280,195); // 将截图添加到PDF

            // pdf.save('1')

            // 生成PDF Blob

            const blob = pdf.output("blob");

            window.open(URL.createObjectURL(blob));

            setviewbtnloading(false)

        } catch (error) {

          console.error('Error generating PDF:', error);

        }

    };