注入 actionCreators 与 mapDispatchToProps 有什么好处？

Question

我正在浏览connect文档并试图理解此示例：

注入待办事项和所有动作创建者

import * as actionCreators from './actionCreators'
function mapStateToProps(state) {
return { todos: state.todos }
}
export default connect(mapStateToProps, actionCreators)(TodoApp)

为什么这里不需要mapDispatchToProps？dispatch在哪里？

我了解动作、dispatch和mapDispatchToProps，但我对动作创建者和上述语法有点模糊。

Answer 1

你可以传递Object或Function：

如果传递了一个对象，则假定其中的每个函数都是 Redux 操作创建者。Connect将为您绑定dispatch。

import * as actionCreators from './actionCreators';
connect(mapStateToProps, actionCreators)(TodoApp)

然后在组件中

this.props.someActionCreator();

如果传递了一个函数，它将被调度。由你来返回一个对象，该对象以某种方式使用 dispatch 以你自己的方式绑定动作创建者。您可以使用 Redux 中的bindActionCreators()帮助程序。 如果ownProps被指定为第二个参数，则其值将是传递给组件的 props，并且每当组件收到新 props 时，都会重新调用mapDispatchToProps。

function mapDispatchToProps(dispatch) {
return { actions: bindActionCreators(actionCreators, dispatch) }
}

如果省略它，默认实现只是将调度注入到组件的 props 中。

然后在组件中：

this.props.dispatch(someActionCreator());

source react-redux DOCS

因此，注入 actionCreators 的对象而不是函数的好处是将 actionCrators 传递给组件的形式更方便、更简洁

。