J'ai construit la prochaine structure de réduction :

//index.js

import userReducer from "./user";

const initState = {
    user: null
};

const rootReducer = (state = initState, action) => {
    const {
        user
    } = state;

    if (action === "SIGN_OUT") {
        return {
            user: userReducer(null, action)
        };
    }
    return {
        user: userReducer(user, action)
    };
};

export default rootReducer;

//user.js

const initState = {
    userId: null,
    clientId: null,
    type: null
}

const userReducer = (state = initState, action) => {
    switch (action.type) {
        case "SET_USER_ID" :
            const { userId } = action;
            return {
                ...state,
                userId
            };
        case "SET_USER_DATA" :
            const { userData } = action;
            return {
                ...state,
                ...userData
            };
        default : return state;
    };
};

export default userReducer;

Evidemment, j'ai plus de réducteurs, c'est pour simplifier la démonstration.

Ma logique est que si le premier paramètre de userReducer est une valeur fausse, il utilisera initState. Dans le rootReducer, la valeur de user est nulle, donc à l'intérieur de userReducer, il devrait utiliser initState comme état.

Malheureusement mon état ressemble à ceci :

{ user: null }

Qu'est-ce que je fais mal?

0
Gergő Horváth 16 mars 2019 à 23:23

2 réponses

Meilleure réponse

Les valeurs d'argument par défaut sont appliquées uniquement lorsque undefined ou aucune valeur n'est transmise. Le passage de null et d'autres valeurs fausses en dehors de undefined remplacera la valeur par défaut. Plus d'informations à ce sujet ici.

De plus, comme chrisheyn l'a souligné dans sa réponse, if (action === "SIGN_OUT") devrait être if (action.type === "SIGN_OUT")

2
abadalyan 16 mars 2019 à 20:59

Dans rootReducer vous utilisez le paramètre action comme chaîne ("SIGN_OUT"). Ensuite, vous passez cette var dans userReducer et vous essayez de lire une chaîne à partir de action.type. C'est probablement le problème.

Je ne suis pas sûr, mais il semble que vous essayiez de combiner plusieurs réducteurs dans rootReducer, n'est-ce pas ?

Vérifiez la fonction buildin redux combineReducers : https://redux.js.org/api/combinereducers

1
chrisheyn 16 mars 2019 à 20:51