react-redux:当 mapDispatchToProps 是对象时,调度操作如何工作?

Chr*_*Bao 3 redux react-redux

在使用 的过程中react-redux,我遇到了一个关于 的混淆点mapDispatchToProps,当它是一个对象而不是函数时。

例如,在我的项目中,我有以下操作创建者:

export const incrementBy2 = () => ({
  type: INCREMENT_REQUESTED_2,
})
Run Code Online (Sandbox Code Playgroud)

在我的组件中,我导入了 action creator 并为 mapDispatchToProps 设置了它:

import { incrementBy2 } from '../actions'
import { connect } from 'react-redux'

// define the Home component, omit the details
const Home = props => ()

// omit the details
const mapStateToProps = state => ()

const mapDispatchToProps = {
  incrementBy2
}

export default connect(
  mapStateToProps,
  mapDispatchToProps
)(Home)
Run Code Online (Sandbox Code Playgroud)

然后在组件中,我可以访问 action creator as props.incrementBy2,它在我的项目中也运行良好。

我的困惑点,incrementBy2只是一个动作创建者,那么如何以及在哪里进行分派?

Jor*_*nev 5

根据官方文档

[mapDispatchToProps(dispatch, [ownProps]): dispatchProps](对象或函数):如果传递了一个对象,则假定其中的每个函数都是 Redux 动作创建者。具有相同函数名称但每个动作创建者都包含在调度调用中以便可以直接调用它们的对象将合并到组件的 props 中。

你也可以按照源代码。在那里你可以检查实现细节。