时间戳

首页 > 解决方案 > 如何合并页脚？

reactjs - 如何合并页脚？

问题描述

我想知道如何将页脚合并到我的报告中（例如：第 1 页，共 2 页）。使用库在其 URL 示例中建议的相同代码，但变量： const totalPagesExp = "{total_pages_count_string}"; 从不值钱。提前致谢。

[![import jsPDF from "jspdf";
import "jspdf-autotable";

const generatePDFTable = (reportData) => {
  // initialize jsPDF
  const doc = new jsPDF();

  const totalPagesExp = "{total_pages_count_string}";

  doc.autoTable({
    columns: reportData.columns,
    body: reportData.body,
    theme: reportData.theme ? reportData.theme : "grid",
    styles: { ...reportData.styles },
    columnStyles: { ...reportData.columnStyles },
    bodyStyles: { ...reportData.bodyStyles },
    headStyles: { ...reportData.headStyles },
    footStyles: { ...reportData.footStyles },
    showHead: reportData.showHead ? reportData.showHead : "everyPage",
    showFoot: reportData.showFoot ? reportData.showFoot : "everyPage",
    pageBreak: reportData.pageBreak ? reportData.pageBreak : "auto",
    rowPageBreak: reportData.rowPageBreak ? reportData.rowPageBreak : "auto",
    didDrawPage: function (data) {
      // Footer
      let str = "Page " + doc.internal.getNumberOfPages();
      if (typeof doc.putTotalPages === "function") {
        str = str + " of " + totalPagesExp;
      }
      doc.setFontSize(10);
      const pageSize = doc.internal.pageSize;
      const pageHeight = pageSize.height
        ? pageSize.height
        : pageSize.getHeight();
      doc.text(str, data.settings.margin.left, pageHeight - 10);
    },
  });

  doc.save(reportData.fileName ? reportData.fileName : "table.pdf");
};

export default generatePDFTable;][1]][1]

标签： reactjsjspdfjspdf-autotable

解决方案

import jsPDF from "jspdf";
import "jspdf-autotable";

const generatePDFTable = (reportData) => {
  // initialize jsPDF
  const doc = new jsPDF();

  const totalPagesExp = "{total_pages_count_string}";

  doc.autoTable({
    columns: reportData.columns,
    body: reportData.body,
    theme: reportData.theme ? reportData.theme : "grid",
    styles: { ...reportData.styles },
    columnStyles: { ...reportData.columnStyles },
    bodyStyles: { ...reportData.bodyStyles },
    headStyles: { ...reportData.headStyles },
    footStyles: { ...reportData.footStyles },
    showHead: reportData.showHead ? reportData.showHead : "everyPage",
    showFoot: reportData.showFoot ? reportData.showFoot : "everyPage",
    pageBreak: reportData.pageBreak ? reportData.pageBreak : "auto",
    rowPageBreak: reportData.rowPageBreak ? reportData.rowPageBreak : "auto",
    didDrawPage: function (data) {
      // Footer
      let str = "Page " + doc.internal.getNumberOfPages();
      if (typeof doc.putTotalPages === "function") {
        str = str + " of " + totalPagesExp;
      }
      doc.setFontSize(10);
      const pageSize = doc.internal.pageSize;
      const pageHeight = pageSize.height
        ? pageSize.height
        : pageSize.getHeight();
      doc.text(str, data.settings.margin.left, pageHeight - 10);
    },
  });

  // Total page number plugin only available in jspdf v1.0+
  if (typeof doc.putTotalPages === "function") {
    doc.putTotalPages(totalPagesExp);
  }

  doc.save(reportData.fileName ? reportData.fileName : "table.pdf");
};

export default generatePDFTable;

推荐阅读