How could I render a table?

[aghalloran]

How could I render a table on the PDF page?

After skimming through the documentation, I find react-pdf to be very intuitive and I can easily follow the examples. I would love to use it however I need to render simple tables which hold tabular data. I don't see a component for a table, however wager it could probably be built using either some text components with styling or the canvas component. I'm not familiar with either to be sure however would be grateful if someone could point me in the right direction. Thank you!

[ahmad-reza619]

There is no table component officially just yet, but you can check this one out
https://github.com/dmk99/react-pdf-table

[Chagall]

I've built a simple example that shows how to implement a Table. It's pretty straightfoward, check it out: https://github.com/Chagall/react-pdf-table-example

[Chagall]

What you need is something like this? Let me know and I will make the code available to you if it is. This is what I understood from your description.

[mateusmlo]

Exactly! Thank you so much in advance 🙏🏽

[Chagall]

Check my example repository: https://github.com/Chagall/react-pdf-table-example

I updated it and added the example above as a file named VerticalTableDocument.js. To test it you need to import it on App.js and change the TableDocument for VerticalTableDocument. Or you can just copy the VerticalTableDocument.js file to your project and use it there.

Hope it helps.

[mateusmlo]

It helped me a lot! Sorry for the late reply, I actually saw it the day it was posted but got caught in the moment. Thank you so much Fabio!

[Chagall]

You're welcome buddy!

[diegomura]

Thank you both! Those projects look awesome

[naveenfaclon]

i am using GPT for creating table from my data. Now, when i download my PDF file which includes that table, it distorts the format of my table what to do?

[dgtllion]

@diegomura may be we can create a feature request for Table component?
The need for this is that there are some challenges in Table with colSpan's and rowSpan's.
Now you can only create simple tables.

Or may be you can expose the measurements of View/Text like heights/widths to calculate those spans for Table.