在我的 redux-observable 史诗中获取操作必须是简单的 objects 错误

Question

所以我有一个 api 像这样使用 fromFetch:

const myApi = () => {
  const data$ = fromFetch(url);
  return data$;
}

我的史诗看起来是这样的：

export const fetchEpic = (action$: any) => {
  return action$.pipe(
    ofType(Actions.FETCH),
    mergeMap(action =>
      myApi().pipe(
        map(result => {
          console.log(result)
          return mapTo({ type: Actions.ADD_ITEMS, payload: result });
        }),
      ),
    ),
  );
};

console.log（结果）似乎工作顺利，没有问题。但是我收到错误：

Error: Actions must be plain objects. Use custom middleware for async actions.

附带说明一下，我尝试进行一些基本测试并在下面进行了测试并且效果很好那么为什么上面的史诗不起作用？

export const fetchEpic = (action$: any) => {
  return action$.pipe(
    ofType(Actions.FETCH),
    mapTo({ type: Actions.ADD_ITEMS, payload: ['hello'] })
  );
};

做了一个上面的codesandbox，同样的错误： https://codesandbox.io/s/agitated-visvesvaraya-b8oun

Answer 1

在您的 map 块中，您应该直接 return 操作。您的代码用 mapTo 包装它，这是一个只能在 pipe 方法中使用的运算符。所以你的 fetchEpic 应该是：

export const fetchEpic = (action$: any) => {
  return action$.pipe(
    ofType(Actions.FETCH),
    mergeMap(action =>
      myApi().pipe(
        map(result => {
          console.log(result)
          return{ type: Actions.ADD_ITEMS, payload: result };
        }),
      ),
    ),
  );
};

这是更新后的代码沙箱：https://codesandbox.io/s/gracious-darkness-9dc9q

由于您已经在使用 TypeScript，我发现如果您正确输入 epics，例如

，TypeScript 编译器实际上可以发现许多此类错误

export const fetchEpic : Epic<YourActionType, YourActionType, YourStateType> = (action$) => { ..

在我的 redux-observable 史诗中获取操作必须是简单的 objects 错误

Getting Actions must be plain objects error with my redux-observable epic

rxjs

redux-observable