javascript - react-redux 中的几个同名 Action

Question

我有来自不同包的 Action ，它们具有相同的名称，如下所示:

import { bindActionCreators } from 'redux';
import { setActiveLanguage } from 'react-localize-redux';
import * as actionCreators from '../actions/actionCreators';
import * as toggleActions from '../actions/toggleActions';
import {actions as rrfActions} from 'react-redux-form';

function mapDispatchToProps(dispatch) {
    return bindActionCreators(
      {
        ...actionCreators,
        ...toggleActions,
        setActiveLanguage,
        ...rrfActions
      },
      dispatch);
  }

export default mapDispatchToProps

因为 toggleActions 和 rrfActions 都有一个 toggle Action ，嵌套 rrfActions 可以达到目的 (? ) 来调用操作，但我无法阻止 reducers 监听相同的 TOGGLE 操作类型。除了对所有连接的组件没有通用的 mapDispatchToProps 而不是非常具体的组件

之外，是否有其他解决方法

干杯!

Answer 1

根据 redux 的设计，相同的操作类型由相同的 reducer 监听器提供服务。如果您希望不同的监听器对您的操作负责，则该操作必须具有不同的类型。为什么不想使用前缀/后缀？

MY_SIMPLE_ACTION
MY_SIMPLE_ACTION_AREA1
MY_SIMPLE_ACTION_AREA2

在 action dispatcher 中，您可以传递一个额外的参数来指定区域:

export function onDoSomething(param1, param2, referer) {
  return dispatch({
    type: MY_SIMPLE_ACTION + (referer ? `_${referer}` : ''),
    payload: { param1, param2 }
  })
}