2016-08-31 10 views
3

Stellen Sie sich vor, ich hatte drei Hauptteile in meiner Reaktion Anwendung, deren Zustand wird vollständig von redux verwaltet (kein lokaler Zustand). Login, Register und View Profile:Wie organisiert man den Anwendungsstatus im Redux-Speicher?

ist mein Verständnis, dass der Ausgangszustand wie so aussehen:

const initialState = { 
    login: {}, 
    register: {}, 
    profile: {}, 
    appUI: { 
    menuToggled: false 
    } 
}; 


export function mainReducer(state = initialState, action) { 
... 

Dann in meiner Container-Komponente i den relevanten Teil des Staates ziehen würde unter Verwendung reagieren-redux connect():

Wenn Benutzer also Benutzername, Passwort usw. in der Präsentationskomponente der Anmeldung eingeben, würde der globale Status aktualisiert (mit Aktionen) und würde am Ende suchen wie folgt:

{ 
    login: { 
    username: "foo", 
    password: "bar" 
    }, 
    register: {}, 
    profile: {}, 
    app: { 
    menuToggled: false 
    } 
}; 

Ist dies ein gültiger Ansatz? Mit gültig meine ich die Weise, in der ich den Zustand meiner Anwendung organisiere, also wenn es mehr "Abteilung" zur Anwendung als sein Wachsen geben würde (denken Sie, Crud) würde ich größere Zahlfelder im redux haben. Ich bin neu, reagiere und reduziere und möchte keine Anti-Muster vermeiden.

+0

Ich glaube nicht, dass es sicher ist, das Passwort im Laden zu behalten, nicht? – JohnnyQ

Antwort

1

Dies ist definitiv kein Anti-Pattern. Der gesamte Zweck von mapStateToProps - der erste Parameter in connect - besteht darin, den Teil des Anwendungsstatus zu extrahieren, den die Komponente benötigt.

Die eine Sache, die mich betrifft, ist jedoch, dass Ihre Container-Komponente auf etwas wie Anmeldeinformationen angewiesen ist. Außerdem weiß ich nicht, wie Sie Ihren Reduzierer strukturiert haben, aber ich würde empfehlen, die combineReducers Funktion von redux zu verwenden.

Verwandte Themen