React Redux - 为什么要使用嵌套函数?[复制]

React Redux - Why should I use nested functions? [duplicate]

提问人:Zonaed Hasan 提问时间:10/8/2023 更新时间:10/8/2023 访问量:34

问:

我正在编写 React Redux 教程。itemActions.js有下面的代码。为什么要使用嵌套函数?我可以将 item 和 dispatch 作为一个函数的参数传递。itemActions.js 和 My thinking 的原始代码在底部。请详细解释。提前致谢。

export const addItem = (item) => (dispatch) => {
    axios.post('/api/items', item)
    .then(res => {
        dispatch({
            type: ADD_ITEM,
            payload: res.data
        });
    })
    .catch(err => {
        dispatch(returnErrors(err.response.data, err.response.status));
    });
}


export const addItem = (item, dispatch) => {
    axios.post('/api/items', item)
    .then(res => {
        dispatch({
            type: ADD_ITEM,
            payload: res.data
        });
    })
    .catch(err => {
        dispatch(returnErrors(err.response.data, err.response.status));
    });
}
reactjs 函数 redux 嵌套

评论


答:

2赞 phry 10/8/2023 #1

你的教程已经过时了。现代 Redux 不使用ACTION_TYPES,thunk(如示例中所示)通常不再以这种形式编写,您可能不需要公理,现在很少需要可符号。 请阅读官方的 Redux 教程

(您可能会看到更多的差异,例如 reducers 没有被编写为函数等,但这不在您的代码示例中 - 但您本质上是在编写 2019 年之前的 Redux)switch..case

对于您的问题:您案例中的高阶函数是创建“thunk”的函数,这是函数形式的可调度 Redux 操作的特例。因此,它更像是一个“动作创建者函数”,而不是一个“双参数函数”。

通过调用来使用 thunk,然后 Redux 本身将执行生成的 thunk。 因为符号在 Redux 中没有被建立为一种模式,你最终会得到一个其他人无法轻松摸索的代码库。dispatch(addItem(item))addItem(item, dispatch)

此外,一个 thunk 可以读取商店内容,因为 thunk 的完整签名是 - 如果你要按照你的风格来写,你最终会调用,而不是只是做,让 Redux 做剩下的事情。(dispatch, getState, extraArgument) => { /* do something */ }addItem(item, dispatch, getState, extra)dispatch(addItem(item))

评论

0赞 Zonaed Hasan 10/8/2023
phry,我很高兴得到你的回复,但我对firs paragrah有点困惑,“你的教程已经过时了。现代 Redux 不使用ACTION_TYPES,thunk(如示例中所示)通常不再以这种形式编写,您可能不需要公理,现在很少需要可符号。请阅读官方的 Redux 教程。您能否在这里给我一篇或多篇文章的链接,这些文章讨论了您提到的所有要点。谢谢。
1赞 phry 10/9/2023
确切的第一段包含指向当前 Redux 教程的链接,这正是推荐的资源。Redux 在这一点上已经有 8 年的历史了。它已经进化了。你的教程教你 Redux,就像它在 4+ 年前一样。请不要浪费时间学习这些过时的做法。