代码之家  ›  专栏  ›  技术社区  ›  Seth Lutske

在redux中,将一个较大减速机的一部分委派给它自己的减速机

  •  0
  • Seth Lutske  · 技术社区  · 5 年前

    我有一个更大的减速机,我想给它添加另一片,这将是相当复杂的。例如,这里有一个已经很复杂的大型减速器:

    const initialState = {
      bigchunk1: { ...someObject },
      bigchunk2: true,
      bigchunk3: [...somevalues],
      bigchunk4: 'etc'
    }
    
    function mainReducer(state = initialState, action){
      switch(action.type){
        case Actions.CASE1:
          return {
            ...state,
            bigchunk1: {
               ...state.bigchunk1;
               somevalue: action.payload.this_is_already_enough_nesting
            }
          }
        case Actions.CASE2:
          return {
            ...state,
            bigchunk4: 'this goes on for awhile'
          }
        // lots more cases
        default:
          return state
      }
    }
    

    我想在state中添加一个新的切片,这样整个initialState最终会出现在商店中,如下所示:

    const initialState = {
      bigchunk1: { ...someObject },
      bigchunk2: true,
      bigchunk3: [...somevalues],
      bigchunk4: 'etc',
      newslice: { ...someComplicatedThing }
    }
    

    但是,我不必将所有的新案例都写入我原来的reducer(以及非常混乱的嵌套和扩展操作符),我想编写一个新的reducer,只处理与之相关的案例 newslice :

    const initialState = { ...someComplicatedThing }
    
    function newSliceReducer(state = initialState, action){
      switch(action.type}{
        // cases here
      }
    }
    

    我知道 combineReducers ,但我很难思考如何在这种情况下应用它。 组合传感器 我们可以把这两个减缩器作为兄弟放在一起,但是我怎样才能把它们结合起来呢 newSliceReducer 它的关联状态变成了 mainReducer 名下 新闻片 ? 我觉得这应该很简单,但我现在不明白。我一直在阅读redux文档,但我看不清楚答案。我不想使用 redux-toolkit 或任何外部图书馆。

    1 回复  |  直到 5 年前
        1
  •  1
  •   Krishna Chaitanya Kornepati    5 年前

    在默认开关情况下,可以执行以下操作:

          default: 
              let newSlice = newSliceReducer(state.newslice, action)
              if (newSlice !== state.newslice) {
                  return {...state,newslice:newSlice}
              }
              return state
    

    您可以将Redux看作是一种编码模式,而不是库。

    reducer的任务是更新状态,如果更改了,则返回新对象,否则返回旧对象。如果返回了一个新对象,react会假定发生了更改,并触发刷新。

    现在,你有一个“newSliceReducer”,它的状态只是主reducer的一部分。因此,我遵循上述规则,将状态为原始状态较小部分的新减速器调用,并检查结果是否发生变化。如果是,我创建了一个状态更新的新对象,否则返回旧状态。

    检查newSlice是否真的发生了变化很重要。