0

This is the reducer:

function carouselGames(state = 
    {
        firstCarousel: {
            games: [],
            error: ''
        },
        secondCarousel: {
            games: [],
            error: ''
        },
        thirdCarousel: {
            games: [],
            error: ''
        }
    }, action){
    switch(action.type){
        case actions.SET_FIRST_CAROUSEL_GAMES_SUCCESS: {
            return {
                ...state,
                firstCarousel: {
                    ...state.firstCarousel,
                    games: [...action.payload],
                    error: ''
                }
            }
        }
        case actions.SET_FIRST_CAROUSEL_GAMES_ERROR: {
            return {
                ...state,
                firstCarousel: {
                    ...state.firstCarousel,
                    games: [],
                    error: action.payload
                }
            }
        }
        default:
            return state;
    }
}

It updates the state but does not re-render the component: Click here to see that the objects now contain a game prop with 3 arrays

Did I make some mistake on the reducer? I searched a lot for updating nested objects and re-checked it so many times but it just does not work...

ivka96
  • 1
  • 1
    [How to create a Minimal, Reproducible Example](https://stackoverflow.com/help/minimal-reproducible-example) – Dennis Vash Feb 07 '21 at 14:20
  • Add the component's code too. Where are you dispatching the action and Where is the redux's state being consumed? – Ramesh Reddy Feb 07 '21 at 14:22
  • What action is dispatched, how did it change the state with what reducer code and how are you selecting from state in the component? – HMR Feb 07 '21 at 17:39

0 Answers0