CODEWITHSUNDEEP
reactjstypescriptreact-reduxreact-hooksreact-table
LCIII
LCIII

Reputation: 3626

How to prevent expanded React-Table row from collapsing on re-render?

I have a simple react-table with an expanded sub component whose data is tied to a Redux state object.

When the sub component gets expanded, I trigger an api call to get some additional data to be lazy-loaded onto the redux store. The redux store gets updated with the new data and the sub component DOM gets successfully updated as well, but the problem is the expanded row doesn't stay expanded after the re-render. It collapses.

Is there a way to keep my expanded rows expanded even after the redux store gets updated and a re-render is triggered?

Upvotes: 11

Views: 6044

Answers (2)

Saurabh
Saurabh

Reputation: 374

For me, setting collapseOnDataChange to false worked

You could also try freezeWhenExpanded property and set it to true.

Upvotes: 1

Rohit Garg
Rohit Garg

Reputation: 851

Set autoResetExpanded to false in configuration, more details - https://react-table.tanstack.com/docs/api/useExpanded

Upvotes: 8

Related Questions