javascript - 与注入(inject) mapDispatchToProps 相比，注入(inject) actionCreators 有什么好处？

Question

我正在浏览 connect docs并尝试理解这个例子:

Inject todos and all action creators

import * as actionCreators from './actionCreators'

function mapStateToProps(state) {
  return { todos: state.todos }
}

export default connect(mapStateToProps, actionCreators)(TodoApp)

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

我了解操作、dispatch 和 mapDispatchToProps，但我对 Action Creators 和上述语法有点模糊。

Answer 1

您可以通过Object或Function :

如果传递一个对象，则其中的每个函数都被假定为 Redux 操作创建者。 Connect将把 Action 创建者绑定(bind)到 dispatch为你。

import * as actionCreators from './actionCreators';

connect(mapStateToProps, actionCreators)(TodoApp)

然后在组件中

this.props.someActionCreator();

如果传递了一个函数，它将被调度。您可以返回一个对象，该对象以某种方式使用分派(dispatch)以您自己的方式绑定(bind) Action 创建者。您可以使用bindActionCreators() Redux 的助手。如果ownProps被指定为第二个参数，它的值将是传递给您的组件的 props，并且 mapDispatchToProps每当组件收到新的 props 时就会重新调用。

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

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

然后在组件中:

this.props.dispatch(someActionCreator());

source react-redux DOCS

因此，通过函数注入(inject)actionCreators对象的好处是，将actionCrators传递给组件的形式更加方便和简洁