无法理解 Redux-thunk 中间件

Posted 2023-02-22

【中文标题】无法理解 Redux-thunk 中间件

【英文标题】：Can not get the point of Redux-thunk middleware

【发布时间】：2016-10-18 14:42:55

【问题描述】：

全部：

我对 Redux 还很陌生，当我尝试按照关于异步操作的教程 http://redux.js.org/docs/advanced/AsyncActions.html

有一个叫做 thunk 的概念，我不太明白为什么我们需要一个 thunk 来执行异步操作，为什么我们不能简单地发送 init 信号，然后 fetch data 然后在 fetch data 的 promise 中发送完成信号?

function fetchDataAction(dispatch)
    dispatch(
        type: "START"
    )
    fetch("DATA_URL")
        .then(function(res)return res.json();)
        .then(function(json)
            dispatch(
                type: "SUCCESS",
                data: json
            )
        )

谢谢

【问题讨论】：

你在你的问题中几乎描述了一个 thunk。数据的获取是异步发生的，因此只有在我们收到响应后才能触发调度。

@MarioTacke 谢谢，所以 thunk 只是我放在这里的一个花哨的词？如果我的大部分操作只是获取数据，我根本不需要 thunk？

thunk 不仅仅是一个花哨的词。据我了解，redux 的运行方式，所有操作都必须返回一个可以被 reducer 立即使用的操作。由于异步操作稍后会返回数据（阅读：不是立即），因此我们需要在收到数据后打开执行特定操作的途径。为此，很多项目使用redux-thunk 中间件。

【参考方案1】：

Redux 存储仅将普通对象识别为 Action。因此，您只能将dispatch 对象存储到存储中。 redux-thunk 教商店将功能识别为操作。 有关redux-thunk的更多信息，请阅读作者本人：How to dispatch a Redux action with a timeout?

另一种思考方式是redux-thunk 为您提供直接访问dispatch 的方法，以便您可以发送任何您想要的内容。

如果没有redux-thunk，您的动作创建者就没有dispatch 作为参数。在这种情况下，fetchDataAction 仅起作用，因为redux-thunk 将dispatch 作为参数提供给它。