Как включить условные и безусловные вызовы в RxJS mergeMap?

Question

После того, как вызов API получает данные, мне нужно вызвать ряд дальнейших действий на FETCH_DATA_SUCCESS.

Действия 'RESET_IMAGE_DATA' и 'INITIALISE_FILTERS' должны вызываться на каждом 'FETCH_DATA_SUCCESS'. Однако 'SET_PIVOT' должен вызываться только тогда, когда action.context === 'pivot'.

Итак, есть 2 возможных случая.

В первом случае 'RESET_IMAGE_DATA' и 'INITIALISE_FILTERS' называются.

Во втором случае вызываются 'RESET_IMAGE_DATA', 'INITIALISE_FILTERS' и 'SET_PIVOT'.

Я попробовал все виды решений безуспешно, и моя последняя попытка приведена ниже. Любая помощь будет оценена.

const loadDataEpic = (action$, state$) =>
  action$.pipe(
    ofType('FETCH_DATA_SUCCESS'),
    mergeMap(action => {
      if (action.context === 'pivot') {
        return of({
          type: 'SET_PIVOT',
        });
      }
      return of(
        {
          type: 'RESET_IMAGE_DATA',
        },
        {
          type: 'INITIALISE_FILTERS',
        }
      )}
    )
  );

Answer 1

Вы можете изменить of на from, чтобы отправить массив, так как массив позволяет легко динамически вставлять.

Как это:

const loadDataEpic = (action$, state$) =>
    action$.pipe(
        ofType('FETCH_DATA_SUCCESS'),
        mergeMap(action => {
            const pivotActions = action.context === 'pivot'
                ? [{ type: 'SET_PIVOT' }]
                : [];
            return from([
                ...pivotActions,
                {
                    type: 'RESET_IMAGE_DATA'
                },
                {
                    type: 'INITIALISE_FILTERS'
                }
            ]);
        })
    );

Answer 2

попробуйте это:

const loadDataEpic = (action$, state$) =>
  action$.pipe(
    ofType('FETCH_DATA_SUCCESS'),
    mergeMap(action => {
     const isPivot = action.context === 'pivot';
     return of(
       { type: 'RESET_IMAGE_DATA' },
       { type: 'INITIALISE_FILTERS' },
       ...(isPivot ? [{ type: 'SET_PIVOT' }] : [])
     );
    })
  );

добавит действие SET_PIVOT, только если условие истинно.

p.s .: Если вам не нравится синтаксис, вы можете использовать массив и выдвинуть его в зависимости от условия, а затем вернуть его с of(...actions)