庞大的前端项目该如何根据feature处理store
2017-11-28 本文已影响80人
张培_
情景补充1
- 项目如果演变到很大的时候,如果就会产生很多的container
- 每个container都会有一个reducer,那么rootReducer就会变成的超级长
const rootReducer = combineReducers({ routing: routerReducer, ********* })
- store中就会有很多的对象,很难做统一的处理控制
情景补充2
- 项目中有多个feature
- 一个feature不同reducer之间可能会共享数据
- 所以我们希望各个feature之间可以隔离
- 各个reducer之间也可以做到很好的隔离
解决方案一
因此尝试采用一个feature一个reducer
- 但是这样做导致feature的reducer函数特别长
- 并且做不到feature内的container 的reducer之间的相互隔离
解决方案二(最优)
- 一个feature做一次combineReducers暴露出一个reducer
- 将所有的feature reducer再做一次combineReducers,放进store
//feature1
const feature1 = combineReducers({
c1: c1Reducer,
c2: c1Reducer
})
//feature2
const feature2 = combineReducers({
c1: c1Reducer,
c2: c1Reducer
})
//store
const store = combineReducers({
feature1:feature1
feature2:feature2
})
优点
- 既做到了feature的隔离
- 又做到了container的隔离
- 不会让一个feature的reducer function因为要容纳整个feature的reducer变得很长case很多