如何在Vue项目中解决导出Word时图片过大导致显示不全的问题？

async function resizeImage(base64Str, maxWidth, maxHeight) {
  return new Promise(resolve => {
    const img = new Image();
    img.onload = () => {
      const canvas = document.createElement('canvas');
      const ctx = canvas.getContext('2d');
      let width = img.width;
      let height = img.height;

      // 保持长宽比缩放
      if (width > height) {
        if (width > maxWidth) {
          height *= maxWidth / width;
          width = maxWidth;
        }
      } else {
        if (height > maxHeight) {
          width *= maxHeight / height;
          height = maxHeight;
        }
      }

      canvas.width = width;
      canvas.height = height;
      ctx.drawImage(img, 0, 0, width, height);
      resolve(canvas.toDataURL());
    };
    img.src = base64Str;
  });
}

import jsPDF from 'jspdf';
import html2canvas from 'html2canvas';

async function exportToPDF(htmlElementId, title) {
  const pdf = new jsPDF('l', 'pt', 'a4'); // 横向，点为单位，A4纸张
  const canvas = await html2canvas(document.getElementById(htmlElementId));
  const imgData = canvas.toDataURL('image/png');
  const imgWidth = pdf.internal.pageSize.getWidth();
  const imgHeight = canvas.height * imgWidth / canvas.width;
  let heightLeft = imgHeight;
  let position = 0;

  pdf.addImage(imgData, 'PNG', 0, position, imgWidth, imgHeight);
  heightLeft -= pdf.internal.pageSize.getHeight();

  while (heightLeft > 0) {
    position -= pdf.internal.pageSize.getHeight();
    pdf.addPage();
    pdf.addImage(imgData, 'PNG', 0, position, imgWidth, imgHeight);
    heightLeft -= pdf.internal.pageSize.getHeight();
  }
  pdf.save(`${title}.pdf`);
}

downloadWord(htmlStr, title) {
  let page = `<meta charset="UTF-8"></meta>
              @page { size: A3 landscape; margin: 2cm; }
              ${htmlStr}`;
  saveAs(htmlDocx.asBlob(page, { orientation: "landscape" }), `${title}.doc`);
}