Skip to content

enescang/react-pdf-table

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

15 Commits
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

React PDF Table Generator

🏁 Getting Started

react-pdf-table is super simple table generator for @react-pdf/renderer

✔️ Install

npm install react-pdf-table --save

📒Usage

This package has only 2 main component for creating table. These are TableRow and TableCell.

Import

import ReactPdfTable from "react-pdf-table";

Create Simple Row

Any number of cells can be created in a row.

	...
	<ReactPdfTable.TableRow>
		<ReactPdfTable.TableCell  text="Cell 1"  align="right" />
		<ReactPdfTable.TableCell  text="Cell 1"  align="center" />
		<ReactPdfTable.TableCell  text="Cell 1"  align="left" />
	</ReactPdfTable.TableRow>
	...

Actually, that's all. Also react-pdf-table is supporting nested tables.

Nested Table

<ReactPdfTable.TableRow>
	<ReactPdfTable.TableRow width={70} disableMargin={true}>
		<ReactPdfTable.TableCell text="1" align="center" width={57}  />
		<ReactPdfTable.TableCell text="2" align="center" />
		<ReactPdfTable.TableCell text="3" align="right" />
	</ReactPdfTable.TableRow>
<ReactPdfTable.TableCell text="Name1" align="center"  />
<ReactPdfTable.TableCell text="Name2" align="right"  />
<ReactPdfTable.TableCell text="Name3" align="right"  />
</ReactPdfTable.TableRow>

//Rest of document will be ready ASAP.

Written with StackEdit.