[英]Export to PDF in React-Table
我在 react-table 中有 10 行值。我需要转换为 PDF 格式?.ss 可以转换吗?
使用jsPDF和jspdf-autotable来实现这一点。 看看下面的代码:
import React from 'react';
import jsPDF from "jspdf";
import "jspdf-autotable";
import './App.css';
class App extends React.Component {
constructor() {
super();
this.state = {
people: [
{ name: "Keanu Reeves", profession: "Actor" },
{ name: "Lionel Messi", profession: "Football Player" },
{ name: "Cristiano Ronaldo", profession: "Football Player" },
{ name: "Jack Nicklaus", profession: "Golf Player" },
]
}
}
exportPDF = () => {
const unit = "pt";
const size = "A4"; // Use A1, A2, A3 or A4
const orientation = "portrait"; // portrait or landscape
const marginLeft = 40;
const doc = new jsPDF(orientation, unit, size);
doc.setFontSize(15);
const title = "My Awesome Report";
const headers = [["NAME", "PROFESSION"]];
const data = this.state.people.map(elt=> [elt.name, elt.profession]);
let content = {
startY: 50,
head: headers,
body: data
};
doc.text(title, marginLeft, 40);
doc.autoTable(content);
doc.save("report.pdf")
}
render() {
return (
<div>
<button onClick={() => this.exportPDF()}>Generate Report</button>
</div>
);
}
}
export default App;
这应该会生成这样的 PDF:
希望这可以帮助。
我在reactjs项目中使用webpack,但我可以用来下载表格数据pdf,但我也收到很多htmltocanvas的警告错误我还通过jsPdf文档为reactjs设置了外部依赖项,但仍然收到警告! 请帮我
pdf 中的表格不是直的,有人知道如何解决这个问题吗? @lomse
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.