How to use ReactTable

I want a quick and easy way to generate a data table and think react table will do the job.

I have created a table (connected to firestore) and selected the table in the RT inspector but when I view in a webpage, no data is printed. What other configurations are needed?

Happy (2020) New Year All!

Happy new year to all!!

React Table plugin was not able to handle the document ref object which comes with every “row” in Data sheet when using Firestore plugin.

Plugin is now fixed and you should get the update into Plugin manager when opening the React Studio app

The modification into plugin code can be seen from below

if (col == "key" || (${this._dataVarName}[0][col] instanceof Object)) continue;

2 Likes

I was looking in the forum to see if there was a better way to show the documents in a “table” view similar to Google Spreadsheet and this post came up in the search. I didn’t know about react-table but it seems to fit what I was looking for.

I went to the Plugin Store but I didn’t see React-table. How can I incorporate it into React Studio? What I am doing so far is to create myself a component with different fields in a row showing the values that I want from my database but it seems to me that I am doing things in a not very elegant way.

Thank you!

Hi, You’ll find it from “Npm demo plugin package” which contains three demo npm package plugins.

1 Like

Thank you! Would it be possible to include a button or interaction within each row to so it is possible to delete that registry? Or maybe react-table only allows to consult the data.

hi, that would be something you need to edit in the plugin code. I’m not that familiar with the React table npm package (this was just a quick wrapping of the package into demo plugin) but if you read the package docs you’ll probably find some kind of solution. Then you simply need to edit the plugin code to support the deleting.

1 Like