【问题标题】:How to fetch data with multiple requests in Redux action creator and then send collected data to reducer?如何在 Redux action creator 中获取多个请求的数据,然后将收集到的数据发送到 reducer?
【发布时间】:2017-09-30 13:43:54
【问题描述】:

我正在使用 twich api 来获取一些基本频道信息并检查相关频道是否正在流式传输。

我必须提出两个单独的请求来收集这些数据。

我想用 axios 来做这个:

export function fetchUser(user_id) {
  const get_user = `${ROOT_URL}/users/${user_id}?client_id=${CLIENT_ID}`;
  const get_stream = `${ROOT_URL}/streams/${user_id}?client_id=${CLIENT_ID}`;

  function getUserInfo() {
    return axios.get(get_user);
  }

  function getUserStream() {
    return axios.get(get_stream);
  }

  axios.all([getUserInfo(), getUserStream()])
    .then(axios.spread(function (infos, streams) {
      //WHAT TO DO HERE?
    }));

  return {
    type: FETCH_USER,
    payload: req,
  };
}

问题在于 redux-promis-middleware 仅将一个 Promise obj 转换为用于 reducer 的普通 obj,因为我无法发送包含两个 Promise 作为有效负载的数组。

如何调整此代码以将两个请求结果都发送到 reducer 以将我的状态更新为普通 obj 而不是 promise obj? Mybe不知何故与redux-thunk? 我想指出我在这件事上是全新的,所以我想请求放纵:)

【问题讨论】:

    标签: reactjs asynchronous redux middleware


    【解决方案1】:

    好消息是您可以在有效负载中设置任何内容(包括对象)。所以这会很方便:

    return {
        type: FETCH_USER,//change constant here with appropriate action type
        payload: {infos:infos,streams:streams}
    };
    

    【讨论】:

      猜你喜欢
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 2017-10-25
      • 1970-01-01
      • 2023-03-06
      • 2021-09-30
      相关资源
      最近更新 更多