Angular2 - Teilen der Aktion zwischen Reduzierern eine schlechte Idee?

Question

Wir verwenden ngrx/store in unserer Angular 2 App. Unser Geschäft besteht aus Reduzierern "cameraReducer", "subjectReducer" ... und wir wollen ein paar globale und auch gemeinsame (über Diff-Funktionalitäten) Elemente wie "Loading Data" -Eigenschaften in "appReducer" pflegen.

In einem Szenario wie diesem macht es Sinn, eine Aktion wie {type:LOADING_*, payload} zwischen individualReducers und appReducer zu teilen? Dies sollte eingeschaltet sein, während eine Funktionalität (die wie ein einzelner Teil der Datenoperation [mit einem einzelnen Reducer und einer einzigen Aktion] oder mehrere zugehörige Datenoperationen [mit mehreren Reduzierern und mehreren Aktionen]) gestartet und deaktiviert werden kann einmal vervollständigt. Der AppReducer kann wie folgt aussehen:

Adv - Nein Boilerplate. Nachteile - Die Bestellung von Reduzierstücken spielt eine Rolle, wenn der Indikator ein-/ausgeht.

Oder

case LOADING: 
     return state.setIn('loading') = true; 

können wir Code haben wie am Anfang/Ende jeder Funktionalität Aufruf

this.store.dispatch({action:'LOADING', payload: true}); 
//functionality 
this.store.dispatch({action:'LOADING', payload: false}); 

Adv - Kontrollierte Reihenfolge der Anzeige Pop-on/off. Nachteile - Boilerplate-Code zum Ein-/Ausschalten des Ladens.

Oder

Wir können versuchen, den „Laden“ als kombiniertes Observablen zu berechnen (mit jeweils Minderer ihre eigene lokale „Laden“ Eigenschaft und ein beobachtbares dieser Eigenschaft).

Adv - Nein Boilerplate und Controlled Ordering-Anzeige an/aus. Nachteile - Erhöhte Komplexität und mehr Code möglicherweise.

Answer 1

Der typische Ansatz zum Organisieren eines Redux-Speichers besteht darin, Ihre Daten nach einer Art Domäne pro Schlüssel zu strukturieren und eine Reducer-Funktion zu definieren, die delegiert ist, Updates für diesen Statusabschnitt zu verwalten, der normalerweise mit der combineReducers besteht Nützlichkeit. Redux ermutigt Sie absolut dazu, mehrere Sub-Reducer-Funktionen zu haben, die auf dieselben eingehenden Aktionen reagieren, so dass sliceA und sliceB unabhängig voneinander aktualisiert werden. Die Reihenfolge sollte kein Problem sein, da jeder Sub-Reduzierer im Allgemeinen keine anderen Teile des Staates kennt und nur mit der Aktualisierung seines eigenen Slices befasst ist. Siehe diese Antwort in der Redux-FAQ für einige verwandte Informationen: http://redux.js.org/docs/FAQ.html#reducers-share-state.

Answer 2

Es gibt auch die Option, Effekte zu verwenden. Sie können Änderungen in StateUpdates abonnieren, die bei jeder Statusänderung ausgelöst werden. Ich finde die Beispiel-App unter https://github.com/ngrx/example-app als eine großartige Quelle für Informationen zur Strukturierung der App und ngrx.

Zum Beispiel

@Effect() loadCollection$ = this.updates$ 
    .whenAction(BookActions.LOAD_COLLECTION) 
    .switchMapTo(this.db.query('books').toArray()) 
    .map((books: Book[]) => this.bookActions.loadCollectionSuccess(books)); 

Wenn die LOAD_COLLECTION versandt wird, das heißt, die den Hintergrund funktioniert und löst das LOAD_COLLECTION_SUCCESS die die Komponente aktualisiert. Es scheint, dass jede unreine Funktion, die Nebenwirkungen hat, auf diese Weise am besten funktioniert und nur die reinen Funktionen in den Reduzierern bleiben.