如何在 Redux 中处理列表项

Question

I have a list view, and a detail view on my application.

/list pulls down some general data about a bunch of objects and throws it into an array in redux

/list/5 grabs the details for one of the items on the list

/list is always called no matter what route you hit on the site, so the list eventually populates

I figured it would be best to store all of the details of the item when you hit the details route right in the items indexed location in the list array.

the problem is that the list takes longer to be retrieved than the items details if you go to the item details route first. I don't know what that items index will be in the array when I try to update it's location in redux.

Am I handling this wrong? Should I put the details for the items in a separate place in the store? My thinking was that if the user looks at details for an item twice I can check to see if the additional data is already in the list array index, and so I don't need to make another api call. it's just already there, but if it isn't then make the call and pull the additional details

Not sure if i'm explaining this right but i've been trying to find the right pattern for storing things with redux.

Answer 1

Quoting from my answer at https://stackoverflow.com/a/40898120/62937 :

Yes, a normalized Redux store is the standard recommendation. See Redux FAQ: How do I organize nested or duplicate data in my state? , Structuring Reducers - Normalizing State Shape , and the Selectors and Normalization part of my React/Redux links list for more information.

For manipulating relational/normalized data in your Redux store, I recommend a library called Redux-ORM . You should absolutely use Reselect in general, and Normalizr is good for normalizing data you've received, but Redux-ORM provides a useful abstraction layer for querying and updating that normalized data once it's in the store. I've written a couple blog posts describing its use: Redux-ORM Basics and Redux-ORM Concepts and Techniques .