javascript - Jspdf-自动行跨度修复
问题描述
我一直在使用 Jspdf 和 Jspdf-autotable 插件生成 PDF。检查我用来制作自定义 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;
我怎样才能做到这一点。我已经尝试了我在文档中阅读的所有钩子,但仍然无法让它按照我想要的方式工作。
解决方案
推荐阅读
- python - 与 tensorflow 和 keras 不兼容的软件包
- firebase - 导出 firebase 函数导致“function.js 不存在”错误
- bash - 用于监控进程的 CPU 利用率并在 Linux 中以某个阈值自动关闭的脚本
- python - 如何在 Python 中过滤 API 搜索结果?
- sql - Sybase - 仅返回过去三天的数据
- javascript - 显示元素不起作用:在特定站点上
- python - Python/Numpy:一个 Numpy Unicode 数组可以有多大?
- reactjs - 如何在史诗中调度动作并继续它?
- javascript - 使用 parent() 和其他函数,从列表中删除一个 div
- c - 为什么 sizeof(a()) 不打印 Heo?