How to sort array in Reducer ReactJS

Question

In the state.unsortedAllHighScores there will be an array output, but when I try to get that state and sort that in state.sortedAllHighScores, it stays empty? My expected result would be an array that should be sorted after every dispatch, so when the dispatched is being called, it should output the sorted array. This is a highscore ranking, so you know why I want to have that sort function in here.

const initialState = {
    sortedAllHighScores: [],
    unsortedAllHighScores: []
};

export const game = (state = initialState, action) => {
    switch(action.type) {

case types.HIGH_SCORE: {
            return {
                ...state,
                unsortedAllHighScores: [...state.unsortedAllHighScores, state.updatedCurrentScore],
                sortedAllHighScores: [].concat(state.unsortedAllHighScores).sort((a, b) => {
                    console.log(b - a);
                    return b - a;
                })
            }
        }
     }

what happens if you just sort it like this [...state.unsortedAllHighScores.sort()] — Eslam Abu Hugair
– Eslam Abu Hugair, Commented Nov 3, 2019 at 16:19
1. You're trying to use the result of an assignment to uAHS , inside the assignment to sAHS array. 2. You should add state.updateCurrentScore to your initial state to avoid confusion on how that's being set. 3. I'd break up the assignment to unsortedAllHighScores from the HIGH_SCORE action type, maybe something like SET_SCORES, because you have to update the state of unsortedAllHighScores before you can then use it in the sortedAllHighScores state as a sorted value. In short, you're doing way too many things at once and it's yielding confusing bugs. Atomization is your friend. — Tobiah Rex
– Tobiah Rex, Commented Nov 3, 2019 at 16:55

thortsx · Accepted Answer · 2019-11-03 16:18:49Z

1

Have you ever try like this:

case types.HIGH_SCORE: {
    const tmp = [...state.unsortedAllHighScores, state.updatedCurrentScore]
    return {
        ...state,
        unsortedAllHighScores: tmp,
        sortedAllHighScores: [].concat(tmp).sort((a, b) => {
             console.log(b - a);
             return b - a;
        })
    }
}

answered Nov 3, 2019 at 16:18

thortsx

2,2802 gold badges15 silver badges32 bronze badges

Sign up to request clarification or add additional context in comments.

Collectives™ on Stack Overflow

How to sort array in Reducer ReactJS

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Related