Question

我的目标是一个接一个地发出一个动作。首先应该调度actionOne，接下来应该调度actionTwo。我对redux很新。

action.js

export const actionOne = (value) => ({
    type: Explore.ACTION_ONE,
    payload: { value },
});
export const actioneTwo = payload => ({
    type: Explore.ACTION_TWO,
    payload,
});

reducer.js

case Explore.ACTION_ONE: {
            return {
                ...state,
                tabs: somefunction(state),
                checkFlag: true
            };
        }
case Explore.ACTION_TWO: {
            return {
                ...state,
                checkFlag: false
            };
        }

还有另一个容器（在其epic.js中），我称之为上述操作

export const getCountEpic = (action$, store) =>
    action$.ofType(Constants.GET__COUNT).mergeMap(action => {
                return getCount(action.payload) // This returns our Observable wrapping the Promise
                .map(response => { //some code
           return [actionOne(updatedPayload),actionTwo(updatedPayload)];
             })
          .catch(error => {
                    return [getCountRejected(error)];
                })
                .takeUntil(action$.ofType(AnnotationConstants.GET__COUNT_CANCELLED));
});

我无法调度actionwTwo并获得错误＆＃34;操作必须是普通对象。使用自定义中间件进行异步操作＆＃34;。 actionOne完成后发送的正确方法是什么？

Answer 1

在我看来你正在返回一个可观察的数组，当史诗想要一个可观察的对象时（或当两个动作返回时，一系列可观察对象）。

这可能是您需要的模式Process Manager dispatch multiple actions

export const getCountEpic = (action$, store) =>
  action$.ofType(Constants.GET__COUNT)
    .mergeMap(action => {
      return getCount(action.payload)
        .flatMap(response => { 
          //some code
          return Observable.concat(
            Observable.of(actionOne(updatedPayload)),
            Observable.of(actionTwo(updatedPayload))
          )
        })
        .catch(error => {
          return [getCountRejected(error)];
        })
        .takeUntil(action$.ofType(AnnotationConstants.GET__COUNT_CANCELLED));
});

或者你可以通过更简单的方式逃脱

export const getCountEpic = (action$, store) =>
  action$.ofType(Constants.GET__COUNT)
    .mergeMap(action => {
      return getCount(action.payload)
        .map(response => { 
          //some code
          return Observable.of(
            actionOne(updatedPayload),
            actionTwo(updatedPayload)
          )
        })
...

动作必须是普通对象。使用自定义中间件进行异步操作如何分派操作

1 个答案: