Redux - 调度在行动中未定义

Posted 2023-02-22

【中文标题】Redux - 调度在行动中未定义

【英文标题】：Redux - dispatch is undefined in action

【发布时间】：2020-07-20 06:57:48

【问题描述】：

我是 redux 的新手，但是我有一个我不明白的问题，它无法解决它。

问题是，当我想在我的操作中调度时，我遇到了一个错误，他说：

dispatch 不是函数

是的，他是未定义的，这就是重点，为什么他是未定义的？

export const clearError = dispatch => 
    console.log('clear error')
    console.log(dispatch)

    dispatch(
        type: 'CLEAR_ERROR'
    )

我从 Main.js 调用 clearError 操作，也许我的初始化不正确，但我尝试了几种方法，比如bindActionCreators...

Main.js（我如何通过连接传递道具和调度）

const mapStateToProps = (state) => state
const mapDispatchToProps = 
    clearError: clearError


export default connect(
    mapStateToProps,
    mapDispatchToProps
)(Main)

我真的很困惑，因为在其他组件中，我使用了以相同方式制作的另外两个动作，一切正常......

我不知道它是否可以帮助您了解问题的根源，但我向您展示了我如何配置商店以在 App.js 中调用 configureStore()。

import applyMiddleware, createStore from "redux";
import thunk from 'redux-thunk';

import reducers from './reducers'

const configureStore = () => 
    const middleware = [thunk]
    return createStore(reducers, applyMiddleware(...middleware))


export default configureStore

我正在听取有关 redux 以及使用它的最佳方式的所有帮助和建议！

非常感谢您的阅读❤️

【参考方案1】：

问题是你没有从你的动作创建者那里返回一个函数，dispatch 作为参数之一：

export const clearError = () => dispatch => 

在幕后，当您将动作创建者传递给 mapDispatchToProps 时，Redux 会将分派参数的“映射”到您的动作创建者，然后将映射的动作创建者分配给组件属性。 这也是为什么你必须打电话给this.props.clearError() 而不仅仅是clearError()。

【讨论】：

不错的答案，它工作得很好，谢谢。但我不明白，在这种情况下我们必须使用 ** bindActionCreators** ？

bindActionCreators 是完成与mapDispatchToProps 相同的事情的另一种方式。您可以在文档中阅读有关潜在用例的更多信息：redux.js.org/api/bindactioncreators