javascript - 使用 redux 流下载文件

Question

找不到任何描述它的例子。

我正在尝试使用 React 应用程序创建下载按钮，但要通过 redux，即。实际上，我正在连接到 url 并获取文件作为响应(代码 200)。

export function sendTimeline(token, timelineObj) {
  const request = axios.post(`muURLGoesHere`, timelineObj, {
    headers: {
      "Content-Type": "application/vnd.ms-excel",
      "X-Accept-Version": "v1",
      Authorization: `Bearer ${token}`
    }
  });

  console.log(request);

  return {
    type: constants.actionTypes.TIMELINE_DATA,
    payload: request
  };
}

我如何将它传递给 reducer 并在 react 端下载它。

你可能知道这篇文章有一个例子或任何提示。

谢谢

Answer 1

我不会派发 promise 的 Action 作为有效载荷。使用 redux-thunk另外对连续 Action 进行更细粒度的调度:

const sendTimeline = (token, timline) => dispatch => {
  dispatch({ type: 'sendtimeline/start' })

  return fetch(…)
    .then(res => res.json())
    .then(json => dispatch({
      type: 'sendtimeline/success',
      payload: json
     }))
    .catch(err => dispatch({
      type: 'sendtimeline/error',
      payload: err,
      error: true
     }))
}

这样你就不必处理 reducer 中的异步问题，因为操作会处理这些问题。你也可以做这样的事情:

this.props.sendTimeline(…).then(…)

在组件中使用时，因为 promise 是从操作创建者返回的。

Have a look here as well