Question

在api调用获取数据之后，我需要在FETCH_DATA_SUCCESS上调用许多其他操作。

必须在每个'RESET_IMAGE_DATA'上调用'INITIALISE_FILTERS'和'FETCH_DATA_SUCCESS'操作。但是，只有在'SET_PIVOT'时才必须调用action.context === 'pivot'。

所以，有两种可能的情况。

在第一种情况下，将调用'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)

返回

如何在RxJS mergeMap中包含条件调用和非条件调用？

2 个答案: