React Redux - reducers之间的共享状态(reducers hierarchy)

时间:2016-07-21 12:40:50

标签: javascript reactjs redux react-redux

说我有类似expedia的搜索栏标签:

enter image description here

我希望某些字段(例如离开返回日期)对所有标签都是通用的。

所以我的州应该看起来像

{
  commonReducer: {
    startDate:
    endDate: 
  },
  hotelsReducer: {
    rooms: [],
    location: []
  },
  flightsReducer: {
    from:
    to:
  }
  etc...
}

commonReducer数据在所有其他制表符缩减器之间共享,因为当他们点击搜索按钮时,所有缩减器都应该知道所选日期及其特定数据。

有没有办法在Reducer之间共享数据?或者有某种层次结构,如:

{
  searchTabsReducer: {
    commonReducer: {
      startDate:
      endDate: 
    },
    hotelsReducer: {
      rooms: [],
      location: []
    },
    flightsReducer: {
      from:
      to:
    }
    etc...
  }
}

这样searchTabsReducer会处理所有提交(因为他是唯一一个能够全面了解搜索标签状态的人)?

据我所知,combine reducers函数不支持层次结构。

我最终得到一个包含所有选项卡状态的太大文件,但这感觉不对。

感谢。

2 个答案:

答案 0 :(得分:2)

无需组合减速器,只需将您需要的减速器的状态连接到要显示数据的容器。

从那里开始,使用该数据来分派操作,例如搜索操作。

答案 1 :(得分:1)

在reducers之间共享数据只需要创建独立的reducer。减速机始终可用于其他减速机。

使用redux,所有reducers中都可以使用应用程序状态中的所有数据。

此外,redux-thunk可以为您提供一种在触发操作时从应用程序状态访问所有数据的方法:

(dispatch, getState) => {
  ...
}; 

否则,您可以导入redux操作,以便对特定reducer执行操作,从另一个reducer触发操作。

这种方式,“组合”方法解决了所有用例。