Wie Querschnittsthemen in redux Reduzierungen und Aktionen

Question

Bei einem Anwendungsfall, wie die in dieser Frage behandeln:

Best way to update related state fields with split reducers?

Was für den Umgang mit Aktionen in Reduzierer die beste Praxis ist, die auf Zustand abhängen außerhalb ihres eigenen Staates? Der Autor der obigen Frage endete damit, dass er den gesamten Zustandsbaum als drittes Argument an jeden Reduzierer weitergab. Das scheint schwerfällig und riskant. Die Redux FAQ finden Sie die folgende mögliche Lösungen:

• Wenn ein Druckminderer von einem anderen Stück Zustandsdaten wissen muss, braucht der Staat Baumform kann neu organisiert werden, so dass ein einzelner Minderer mehr der Datenverarbeitung .
• Möglicherweise müssen Sie einige benutzerdefinierte Funktionen für die Behandlung einiger dieser Aktionen schreiben. Dies kann den Austausch von Mähdreschern mit Ihrer eigenen Reduzierfunktion erfordern.
• Sie können auch ein Dienstprogramm wie reduce-reducers verwenden, um combineReducers für die meisten Aktionen auszuführen, aber auch einen spezielleren Reducer für bestimmte Aktionen ausführen, die die Status-Slices kreuzen.
• Async-Aktions-Ersteller wie Redux-Thunk haben über getState() Zugriff auf den gesamten Status. Ein Aktionsersteller kann zusätzliche Daten aus dem Status abrufen und in eine Aktion einfügen, sodass jeder Reduzierer über genügend Informationen verfügt, um seine eigene Statusschicht zu aktualisieren.

In meinem Anwendungsfall, ich habe eine Aktion „continue“, der bestimmt, von welcher Seite ein Benutzer in einem Mehr Form/mehrstufiger Prozess gehen darf, und da dies davon abhängt, so ziemlich die Gesamter App-Zustand, ich kann damit in keinem meiner Kind-Reduzierer umgehen. Für den Moment habe ich den Laden in den Action Creator gezogen. Ich verwende den aktuellen Status des Geschäfts, um ein Aktionsobjekt zu berechnen, das auf meinen "Seiten" -Reduzierer zündet, wodurch die aktive Seite geändert wird. Ich werde wahrscheinlich Redux-Thunk installieren und getState() in diesem Aktionsersteller verwenden, aber ich bin diesem Ansatz noch nicht verpflichtet.

Ich denke, das ist nicht schlecht einer Lösung, da es nur eine Aktion gibt (bis jetzt), die auf diese Weise behandelt werden muss. Ich frage mich nur, ob es eine bessere Lösung gibt oder ob es eine Möglichkeit gibt, meinen Status und die Reducer neu zu strukturieren, um es einfacher zu machen, oder wenn das, was ich tue, innerhalb der Best Practices für Redux liegt. Wenn es ähnliche Beispiele gibt, wäre das auch hilfreich.

etwas mehr Kontext zu geben, sieht mein Zustand Baum zur Zeit wie folgt aus:

{ 
    order: order.result, 
    items: order.entities.items, 
    activePage: { 
    id: 'fulfillment' 
    // page info 
    }, 
    pagesById: { // all the possible pages 
    fulfillment: { 
     id: 'fulfillment' 
     // page info 
    } 
    } 
} 

Die aktive Seite ist die Seite/Abschnitt, in dem die Benutzerdaten, um auf die nächste Seite), um fortzufahren eingeben müssen. Das Bestimmen der aktiven Seite hängt fast immer vom Status der Elemente ab und hängt manchmal vom Status der Bestellung ab. Das Endergebnis ist eine App, bei der der Benutzer einige Formulare nacheinander ausfüllt und nach der Gültigkeit des Formulars fortfährt. Wenn Sie fortfahren, ermittelt die App die nächste benötigte Seite und zeigt sie an.

EDIT: Wir haben den Ansatz der Implementierung eines "globalen" Reducer in Kombination mit Kind Reducers versucht.

Die Implementierung ist so ...

const global = (currentState = initialState, action) => { 
    switch (action.type) { 
    default: 
     return currentState 
    } 
} 


const subReducers = combineReducers({ 
    order, 
    meta 
}) 

export default function (currentState = initialState, action) { 
    var nextState = global(currentState, action) 
    return subReducers(nextState, action) 
} 

Die globalen Minderer erster Lauf auf dem gesamten App-Zustand sind, dann ist das Ergebnis davon an den untergeordneten Minderer zugeführt wird. Ich mag die Tatsache, dass ich nicht mehr einen Haufen Logik in Aktionsmacher stelle, nur um verschiedene Teile des Staates zu lesen.

Ich glaube, dass dies in Übereinstimmung mit den Prinzipien von Redox ist, da jede Aktion immer noch jeden Reducer trifft, und die Reihenfolge, in der Reducer aufgerufen werden, ist immer die gleiche. Irgendwelche Gedanken zu dieser Umsetzung?

EDIT: Wir verwenden jetzt Router-Bibliotheken, um den Seitenstatus zu behandeln, so dass ActivePage und PagesById weg sind.

Answer 1

Wenn state.activePage von state.order und state.items abhängt, können Sie den Store abonnieren und im Falle von Änderungen an "order" oder "items" eine "checkPage" -Aktion versenden, die eine andere aktive Seite setzen kann Falls benötigt. Ein Weg sollte auf einer "Top-Komponente" Reihenfolge und Elemente verbinden, hören Sie ihre Werte und ändern Sie die aktive Seite/Umleitung

Nicht leicht zu verstehen, Ihre Bedenken, ich hoffe, meine Nachricht wird helfen. Viel Glück