如何组织Redux操作创建者以用于Redux React

我正在为我的项目使用

react-redux

和

redux-thunk

我必须使用

connect

将我的

操作注入组件

connect（[MapStateTrops]、[mapDispatchToProps]、[mergeProps]、[options]）

我的任务是提高一级。我不想只以这种形式注入多个操作：

{
  doThis(),
  doThat()
}

{
  this: {
    doThis1(),
    doThis2()
  }
  that: {
    doThat()
  }
}

但以这种形式：

{
  doThis(),
  doThat()
}

{
  this: {
    doThis1(),
    doThis2()
  }
  that: {
    doThat()
  }
}

所以基本上我的问题是我想分派多个action creator文件，因为我想这样组织它们

我尝试了这个版本，它显然不起作用，因为分派并没有注入到每个Thunk Action Creator中：

import * as actions from './actions'

const mapDispatchToProps = (dispatch) => {
  return {
    dataActions: {
      ...actions.dataActions
    }
  };
}

export default connect(null, mapDispatchToProps)(Component);

所以我的最后一个问题是：
我应该这样使用Redux吗？我可以这样组织我的文件吗，如果可以，如何组织？
如果您不希望每个动作创建者都有一个属性，而是希望将绑定的动作创建者组织在两个属性中，每个属性都包含一组动作创建者，您可以执行以下操作：

import { bindActionCreators, .. } from 'redux';
..
const mapDispatchToProps = (dispatch) => {
  return {
    dataActions: bindActionCreators(actions.dataActions, dispatch),
    otherActions: bindActionCreators(actions.otherActions, dispatch),
    ..        
  };
};

bindActionCreators
的第一个参数是包含动作创建者函数的对象（例如，仅导出动作创建者的导入模块）。在实际组件中，您应该能够使用
this.props.dataActions.someDataAction（..）

如果问题只是关于是否可以将不同的动作创建者保存在不同的文件中，您甚至可能不想将动作创建者分组，只需执行以下操作：

return {
  ...bindActionCreators(actionCreatorsFromOneModule, dispatch),
  ...bindActionCreators(actionCreatorsFromAnotherModule, dispatch),
  ..        
};