React:生成并保存 PDF onClick() 问题 - Kendo
React: Generate and save PDF onClick() problem - Kendo
我想要实现的是生成并保存 PDF 文件 onClick(),而不是在 DOM 中渲染任何内容。
内容应包含 React 组件 HTML 和 CSS。
我找到@progress/kendo-react-pdf 包:https://www.telerik.com/kendo-react-ui/components/pdfprocessing/
我的错误示例:https://stackblitz.com/edit/react-taumpw?file=index.js
savePdf 的第一个参数是 DOM 元素而不是 JSX 元素。这会起作用。
class App extends Component {
exportPDF() {
// TODO: Fetch data from backend
// TODO: Move content generator to different function
// const element = <h2>teeeeest</h2>
const element = document.getElementById('test')
savePDF(element, {
paperSize: 'A4',
fileName: 'report.pdf',
margin: { top: '2cm', left: '1.5cm', right: '1.5cm', bottom: '2cm' },
scale: 0.8,
keepTogether: '.card',
});
}
render() {
return (
<div>
<h1 id='hello'>Hello Kendo</h1>
<h2 id='test' style={{display: 'none'}}>teeeest</h2>
<NavLink className="pr-1" to="#" onClick={() => this.exportPDF()}>DOWNLOAD PDF</NavLink>
</div>
);
}
}
这是 savePdf
方法文档的 link - https://www.telerik.com/kendo-react-ui/components/pdfprocessing/api/savePDF/
Kendo 不支持 rendering/saving DOM 之外的 PDF:https://github.com/telerik/kendo-react/issues/307#issuecomment-521232445
我想要实现的是生成并保存 PDF 文件 onClick(),而不是在 DOM 中渲染任何内容。
内容应包含 React 组件 HTML 和 CSS。
我找到@progress/kendo-react-pdf 包:https://www.telerik.com/kendo-react-ui/components/pdfprocessing/
我的错误示例:https://stackblitz.com/edit/react-taumpw?file=index.js
savePdf 的第一个参数是 DOM 元素而不是 JSX 元素。这会起作用。
class App extends Component {
exportPDF() {
// TODO: Fetch data from backend
// TODO: Move content generator to different function
// const element = <h2>teeeeest</h2>
const element = document.getElementById('test')
savePDF(element, {
paperSize: 'A4',
fileName: 'report.pdf',
margin: { top: '2cm', left: '1.5cm', right: '1.5cm', bottom: '2cm' },
scale: 0.8,
keepTogether: '.card',
});
}
render() {
return (
<div>
<h1 id='hello'>Hello Kendo</h1>
<h2 id='test' style={{display: 'none'}}>teeeest</h2>
<NavLink className="pr-1" to="#" onClick={() => this.exportPDF()}>DOWNLOAD PDF</NavLink>
</div>
);
}
}
这是 savePdf
方法文档的 link - https://www.telerik.com/kendo-react-ui/components/pdfprocessing/api/savePDF/
Kendo 不支持 rendering/saving DOM 之外的 PDF:https://github.com/telerik/kendo-react/issues/307#issuecomment-521232445