Question

我是react-redux的新手，我正在使用react-thunk中间件。我收到错误＆＃34; Uncaught TypeError：dispatch不是函数＆＃34;每当我尝试运行我的动作创建者时（按下我的按钮）。任何人都知道发生了什么？

的src /动作/ index.js

function editUserName (newUserName) {
    return {
        type: 'CHANGE_USER_NAME',
        newUserName: newUserName
    }
}

export function editUserNameDelegate () {
    return function (dispatch, getState) {
        return dispatch(editUserName("thunkUser"))
    }
}

的src /容器/ admin.js

import { editUserNameDelegate } from '../actions/index'
...
<input type="button" onClick={ editUserNameDelegate() } value="edit UserName" />

Answer 1

您正在执行editUserNameDelegate内的render功能，而不是将其作为onClick处理程序传递。您想要onClick={editUserNameDelegate}。

此外，如果你以这种方式编写它，你需要确保在调用它时该函数被绑定。你可以这样做：

export default connect(null, {editUserNameDelegate})(MyComponent)

然后在渲染函数中传递onClick={this.props.editUserNameDelegate}。

Answer 2

商店提供dispatch功能。因此，您需要使用react-redux（https://github.com/reactjs/react-redux）中的connect之类的内容将组件连接到商店，或者需要调用store.dispatch(editUserNameDelegate())。

您还需要确保在商店中添加了redux-thunk作为中间件。在此处查看有关redux-thunk的更多信息：https://github.com/gaearon/redux-thunk

Answer 3

您应该提供什么是src / containers / admin.js函数或类？

如果它是功能组件，则应使用onClick={() => editUserNameDelegate()}

dispatch不是TypeError函数

3 个答案: