Jspdf-autotable Rowspan Fix - PullRequest
       12

Jspdf-autotable Rowspan Fix

0 голосов
/ 25 сентября 2018

Я генерирую PDF, используя Jspdf и Jspdf-autotable плагин.Проверьте этот код, который я использую, чтобы сделать мой собственный PDF -

import React, { Component } from 'react';
import jsPDF from "jspdf";
import autotable from "jspdf-autotable";
var getColumns = function () {
  return [
    { title: "Student", dataKey: "studentName" },
    { title: "Gender", dataKey: "studentGender" },
    { title: "Mother Name", dataKey: "motherName" },
    { title: "Father Name", dataKey: "fatherName" }
  ]
};
var getData = function () {
  return rows
};
var rows;
class FeaturePage extends Component {
  constructor() {
    super();
    this.exportpdf = this.exportpdf.bind(this);
    this.state = {
      sales: [
        {
          "studentId": "100122000116",
          "name": "hasan",
          "customStudentId": "1510020",
          "studentName": "Tasnim Tabassum",
          "studentGender": "Female",
          "studentDOB": "2012-07-27",
          "studentReligion": "Islam",
          "motherName": "Sb",
          "fatherName": "Md. Mamunar Rashid"
        },
        {
          "studentId": "100122000116",
          "name": "hasan",
          "customStudentId": "1510020",
          "studentName": "Star",
          "studentGender": "Female",
          "studentDOB": "2012-07-27",
          "studentReligion": "Islam",
          "motherName": "Sd",
          "fatherName": "Md. Mamunar Rashid"
        },
        {
          "studentId": "100122000116",
          "name": "arif",
          "customStudentId": "1510020",
          "studentName": "Tasnim Tabassum",
          "studentGender": "Female",
          "studentDOB": "2012-07-27",
          "studentReligion": "Islam",
          "motherName": "safd",
          "fatherName": "Md. Mamunar Rashid"

        },
        {
          "studentId": "100122000216",
          "name": "arif",
          "customStudentId": "1510000",
          "studentName": "Star2",
          "studentGender": "Female",
          "studentDOB": "2012-06-30",
          "studentReligion": "Islam",
          "motherName": "Mst. Fawalia Akter",
          "fatherName": "Md. Azaharul Islam"

        }
      ]
    };
  }
  exportpdf() {
    var doc = new jsPDF('p', 'pt');
    doc.autoTable(getColumns(), getData(), {
      theme: 'grid',
      startY: 60,
      drawRow: function (row, data) {
        if (data.row.raw.name) {
          doc.autoTableText(data.row.raw.name, data.settings.margin.left + data.table.width / 2, row.y + row.height / 2, {
            halign: 'center',
            valign: 'middle'
          }
          );
          data.cursor.y += 20;
        }
      },
    });
    doc.save('Student List.pdf');
  }
  render() {
    rows = this.state.sales;
    return (
      <div>
        <button onClick={this.exportpdf} className="exportPDF">Export to PDF</button>
      </div>
    );
  }
}
export default FeaturePage; 

И он генерирует этот PDF Generated Pdf

Но я хочу создать что-то вродеэтот Expected Pdf

Как я могу это сделать.Я перепробовал все хуки, которые я прочитал в документации, но тем не менее не смог заставить работать так, как я хочу.

...