在 Vuejs 中使用 VueHtml2pdf 生成新页面时，我遇到 pdf-item 问题

Question

当我生成超过 1 页时，我遇到了 VueHtml2pdf (https://ekoopmans.github.io/html2pdf.js/) 的问题，因为带有 class='pdf-item' 的部分会向下滚动每个新页面页。

这是我的下一个模板：

<template>
  <div class="printInforme">
    <VueHtml2pdf
      :show-layout="false"
      :float-layout="true"
      :enable-download="false"
      :preview-modal="false"
      filename="myPDFInforme"
      :pdf-quality="2"
      :manual-pagination="false"
      :paginate-elements-by-height="794"
      :html-to-pdf-options="htmlToPdfOptions"
      :pdf-format="pdfFormat"
      :pdf-orientation="pdfOrientation"
      @beforeDownload="beforeDownloadInforme($event)"
      ref="html2Pdf"
    >
      <section slot="pdf-content" class="pdf-content">
        <!-- PDF Content Here -->
        <section class="pdf-item" v-for="numPage in numPages" :key="numPage">
         <h1>My code here</h1>
        </section>
      </section>
    </VueHtml2pdf>
  </div>
</template>

我尝试将以下内容放入 class="pdf-item" 中：

'

<section class="pdf-item" :style="setStylePdfItem(numPage)" v-for="numPage in numPages" :key="numPage">

'

还有：

public setStylePdfItem(numPage: any) {
    let marginTop = 'margin-top: 0px;';
    if (numPage > 1 && numPage <= 5) {
      const increment = 14 * numPage + 19;
      marginTop = `margin-top: ${increment}px;`;
      // marginBottom = 'margin-bottom: 20px;' + numPage - 1;
    } else if (numPage > 5 && numPage < 11) {
      const increment = 20 + 4 * numPage;
      marginTop = `margin-top: ${increment}px;`;
    } else if (numPage >= 11 && numPage < 17) {
      const increment = 6 + 4 * numPage;
      marginTop = `margin-top: ${increment}px;`;
    } else if (numPage >= 17) {
      const increment = 3 * numPage + 5;
      marginTop = `margin-top: ${increment}px;`;
    }
    return marginTop;
}

我还尝试在第一个

<div class="html2pdf__page-break" />

结束时添加行

<section>

。

这是问题的例子。我有一个边框：1px 纯红色；在 pdf 项目中：