Zach
Zach

Reputation: 880

Redux Structure Advice

I've built a few React Native apps with Redux and I've traditionally modeled my state after the views/ui. I've come to realize that this isn't the best way to organize Redux state.

Through some recent research, I know now that it's best practice to not store duplicate data in different reducers, as updating them can become tedious. It's better to store data in objects with the keys being the id and the value being the data object itself.

This makes sense for data that will be the same on every screen/page, but what if your app uses the data differently on different screens?

For example:

I have a list of products on a home screen and a list of products on a category screen. Both have pagination and are looking at different subsets of the product data. I could use a selector method here and only select products belonging to the specific category on the category screen, but how would that work with keeping track of pagination data for each one?

If I scroll down on the home screen and load a bunch of product data, then switch to the category screen, I'll have more data already loaded.

Any advice is appreciated, thanks!

Upvotes: 1

Views: 56

Answers (1)

nicecatch
nicecatch

Reputation: 1737

You should normalize your data (https://github.com/paularmstrong/normalizr) so you can have your redux state like:

{
   home: [...list_of_id_products],
   category: [...list_of_id_products],
   data: [actual_array_of_objects]
}

then you can have separated lists, all linked to the same set of data

Upvotes: 1

Related Questions