DataTable expanded rows collapse when modifying one property of a record (using Redux)

UI Components for React
Post Reply
winterspan
Posts: 2
Joined: 14 May 2019, 01:38

14 May 2019, 01:44

I'm using the row expansion feature in a prime react data table being fed records from redux.
If I have a button in the row expansion template that fires off a redux action whose reducer then changes one of the properties of the record, the row will immediately collapse.

This same thing will occur if you are using local state to hold the records, and you change the array of records being passed in (even if they are superficially the same, with the same record keys/values).
seen here: https://codesandbox.io/s/m752k9jq8y

I'm wondering how the table is maintaining the mapping between the expanded rows and the canonical records passed in via the "value" prop on the table.

I need to be able to tweak the fields of the record while maintaining the row expansion. I assume since I'm using redux and the records being passed in via value are immutable, the table is seeing the "new" records as an entirely new set and thus losing the relation to the expanded rows.

Is there a way around this? I'm still surprised the table doesn't just have a method to provide indexes of the rows you want expanded.

Post Reply

Return to “PrimeReact”

  • Information
  • Who is online

    Users browsing this forum: No registered users and 2 guests