将 redux observable 与 axios 一起使用

Question

美好的一天，

我试图通过史诗更新我的数据库，然后将响应发送回以更新商店。 但是，虽然操作最终会发送到我的商店，但有效负载是未定义的。我知道 updateArticle 获取速度不够快是一些问题。如何让它等待 updateArticle 返回响应，然后再发送到商店？

我的史诗：

  action$.pipe(
flowing left-to-right, calling each function with the output of the last one.
    filter(action => action.type === "ADD_ARTICLE_EPIC"), 
    switchMap(
      action =>
        from(updateArticle(action.payload)).pipe(
          map(action => {
            console.log(action);
            return { type: "ADD_ARTICLE", payload: action.payload };
          })
        )
      // return { type: "ADD_ARTICLE", payload: action.payload };
    )
  );

我的 axios：

export const updateArticle = async article => {
  const response = await axios.post(`/articles/updateArticle`, article);
  return response.data;
};

Answer 1

首先你可以使用 from 和 Promise，所以我认为没有必要在 updateArticle 中使用 await。而且，在地图中，您正在从操作访问有效负载，但该功能范围内的操作已经是请求的响应。试试这个：

action$.pipe(
  filter(action => action.type === "ADD_ARTICLE_EPIC"), 
  switchMap(
    action =>
      from(updateArticle(action.payload)).pipe(
        map(response => {
          console.log(response);
          return { type: "ADD_ARTICLE", payload: response.data };
        })
      )
  )
);

然后为您服务：

export const updateArticle = article => {
  return axios.post(`/articles/updateArticle`, article);
};