Wie warten auf/Ertrag zu mehreren Aktionen in einzelnen Redux Observable Epic?

Question

Ich habe eine redux Saga, dass jedes Mal drei verschiedene Aktionen läuft ‚WATCHLIST_FETCH_REQUEST‘ ausgelöst wird:

function* watchFetchWatchlist() { 
    yield takeLatest('WATCHLIST_FETCH_REQUEST', fetchWatchlist); 
} 


function* fetchWatchlist() { 
    const activity = 'ACTIVITY_FETCH_WATCHLIST'; 
    yield put(
    addNetworkActivity(activity) // Action 1: enables a global loading indicator before request is made 
); 
    const { response, error } = yield call(
    api.fetchWatchlist // make an API request 
); 
    yield put(
    removeNetworkActivity(activity) // Action 2: removes the above global loading indicator after request completes 
); 
    if (response) { 
    yield put(
     updateUserWatchlist(response) // Action 3a: updates Redux store with data if response was successful 
    ); 
    } else { 
    yield put(
     watchlistFetchFailed(error) // Action 3b: updates Redux store with error if response failed 
    ); 
    } 
} 

Der Fluss dieser Saga synchron in der Natur. Aktion 1 muss zuerst ausgeführt werden, um den globalen Ladezustand für die App festzulegen. Aktion 2 muss nach Aktion 1 ausgeführt werden und nachdem die API-Antwort zurückkommt, um den globalen Ladezustand zu entfernen, wenn die Netzwerkaktivität beendet ist.

Ich bin ziemlich neu zu Redux-beobachtbar, aber ich habe viel herumgestöbert, um herauszufinden, wie man diese Saga in ein Epos verwandelt. Die beiden Ziele hier:

1. Aktionen nacheinander durchführen, eine nach der anderen, im Gegensatz parallel
2. zum Laufen Führen Sie diese Aktionen/Fluss in einem einzigen Epos (startet, wenn Typ: ‚WATCHLIST_FETCH_REQUEST‘ ausgelöst wird)

Wie erreichen Sie dies mit Redux-Observable? Vielen Dank!

Answer 1

ich die Antwort auf meine Frage gefunden zusammen hier Teile des Gesprächs piecing: https://github.com/redux-observable/redux-observable/issues/62

ich mit etwas entlang der Linien von endete:

import { concat as concat$ } from 'rxjs/observable/concat'; 
import { from as from$ } from 'rxjs/observable/from'; 
import { of as of$ } from 'rxjs/observable/of'; 


export const fetchWatchlistEpic = (action$) => { 
    const activity = 'ACTIVITY_FETCH_WATCHLIST'; 

    return action$.ofType('WATCHLIST_FETCH_REQUEST') 
    .switchMap(() => 
     concat$(
     of$(addNetworkActivity(activity)), 
     from$(api.fetchWatchlist()) 
      .map((data) => Immutable.fromJS(data.response)) 
      .switchMap((watchlist) => 
      of$(
       updateUserWatchlist(watchlist), 
       removeNetworkActivity(activity), 
      ) 
     ) 
    ) 
    ); 
}; 

concat und of scheinen die unterwegs zu sein - an Operatoren, wenn mehrere Aktionen nacheinander ausgeführt werden sollen.