Comment regrouper des demandes dans redux-saga

Question

J'ai besoin de charger des données pour plusieurs cartes. Je veux également envoyer la demande uniquement lorsque les paramètres de graphique changent (distinctUntilChanged) et abandonner les demandes plus anciennes (qui ne reflètent plus les paramètres actuels - c'est ce que fait le switchMap). Dans rxjs et redux-observable, il ressemblerait à ceci:

export const chartsEpic = action$ => 
    action$ 
    .ofType('CHART_DATA_REQUESTED') 
    // group actions by chart id... 
    .groupBy(action => action.meta.chartId) 
    // ...and for each chart: 
    .map(actionsByChart$ => 
     actionsByChart$ 
     // continue only if settings change 
     .distinctUntilChanged((a1, a2) => compare(a1.payload.settings, a2.payload.settings)) 
     // load data, but drop old requests when we get new settings 
     .switchMap(action => 
      Observable.fromPromise(fetchChartData(action.payload.settings)) 
      .map(data => ({type: 'CHART_DATA.SUCCESS', payload: data, meta: action.meta)) 
      .catch(error => Observable.of({type: 'CHART_DATA.FAILURE', payload: error, meta: action.meta})) 
     ) 
    ) 
    // combine actions for all charts into one output stream 
    .mergeAll(); 

Quel est le code comparable redux-saga?

Answer 1

La manière générique pour y parvenir:

function* syncChartsFlow(){ 
    var fetchTask = null; 
    while(true){ 
      yield take([INITIAL_FETCH, SETTINGS_CHANGED]) 
      if(fetchTask){ 
       yield cancel(fetchTask) 
      } 
      fetchTask = yield fork(fetchChartsInfo) 
    } 
} 

function* fetchChartsInfo(){ 
    // fetch info here 
}