Skip to content
Advertisement

Cannot read properties of undefined (reading ‘map’) after adding combineReducers

I combined two reducers functions one returning a list of movies and one that I am building to handle the logic enabling users to add a movie to a ‘favorites list’.

JavaScript

If I do not combine these two reducers and just have movieReducer I get all the movies I have, however, the moment I combined these two I get the error message:

JavaScript

This is the relevant code:

JavaScript

I have read solutions suggesting that I first check if movies contains anything before mapping, so something to the tune of movies?.map, the issue is that this nothing, despite the fact that movies are passed down when I don’t combine my reducers.

Please help me figure this out

Advertisement

Answer

When you use combineReducers, it doesn’t merge the reducers states, but creates a new reducer with these states nested.

By doing combineReducers({ movieReducer, movieFavReducer }) you will have something like this:

JavaScript

That said, the issue seems to be on your mapStateToProps implementation. Try this:

JavaScript

More details about the combineReducers usage at the official docs.

User contributions licensed under: CC BY-SA
3 People found this is helpful
Advertisement