Menu
The react-table https://react-table.js.org component is really cool and getting the data in is a breeze.
But when I try to get a detail component to load when a row is expanded it seems to confuse the row code. I've tried to use the componentWillMount or update functions of the React Component class but when I expand the row it collapses again.
I'm using axios to fetch the data from a server , feed it into the redux state and add it to the row data but the row data in the table doesn't seem to update when the data in the redux state updates.
Does react-table support this use-case?
405
Expand/ Collapse Table Rows Hierarchy using react-table We can easily implement the expand/collapse functionality in tables created using react-table components. The data collection is created in the form of a parent-child structure with a modified column definition. The useExpanded function is imported to use inside the column definition.
You can now push data into a table when using React, as well as edit the data in the page. Reader feedback: Was there a better way? Did I put state in the wrong place?
As a headless utility, React Table v7 doesn’t render or supply data table UI elements out of the box. That means you’re responsible for rendering your own table markup using the state and callback of the hooks provided by React Table.
A simple table library with built in sorting, pagination, selection, expandable rows and customizable styling. Creating yet another React table library came out of necessity while developing a web application for a growing startup.
I've had the same problem. So far, I managed to stop the expanded row from collapsing by adding this property to the main table
freezeWhenExpanded={true}
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With
