reactjs - 使用单个mapDispatchToProps有什么缺点？

Question

我尝试遵循 Redux 文档中有关展示/容器组件的规则，并使用 React-redux connect() 连接我的容器。 。我使用 mapDispatchToProps 和 bindActionCreators将所需的操作注入(inject)到 props 中，调用 actions。我从不使用第二个参数ownProps。

随着我的应用程序变得越来越复杂，我最终得到了许多几乎相同的 mapDispatchToProps() (每个容器一个)；它们绑定(bind)了几乎所有 Action 创建者的所有 Action 。

所以我想知道:只有一个绑定(bind)所有操作并在每个容器中使用它的 mapDispatchToProps 函数会有什么缺点？

类似这样的事情:

import { bindActionCreators } from 'redux'

import * as EventsActionCreators from '../../actions/EventsActionCreators'
import * as TagsActionCreators from '../../actions/TagsActionCreators'
import * as UsersActionCreators from '../../actions/UsersActionCreators'


export default function mapDispatchToProps(dispatch) {
  return {
    actions: bindActionCreators(
      {
        ...EventsActionCreators,
        ...TagsActionCreators,
        ...UsersActionCreators,
      },
      dispatch
    ),
  }
}

Answer 1

如果您的应用程序足够简单，足以保证这一点，那么我会建议您这样做。我看到的缺点(如果有的话)与您的 connects 没有明确说明可用的操作有关。要了解可用的内容，您必须检查 mapDispatchToProps 的定义。

也就是说，为什么要把它作为一个函数呢？ mapDispatchToProps 可以接收一个对象，因此在您的 mapDispatchToProps.js 中，这就足够了:

import * as EventsActionCreators from '../../actions/EventsActionCreators'
import * as TagsActionCreators from '../../actions/TagsActionCreators'
import * as UsersActionCreators from '../../actions/UsersActionCreators'

export default {
  ...EventsActionCreators,
  ...TagsActionCreators,
  ...UsersActionCreators,
}

然后

import mapDispatchToProps from './mapDispatchToProps';
import SomeComponent from './SomeComponent';
export ConnectedComponent = connect(null, mapDispatchToProps)(SomeComponent);