Question

我有一个带有小部件的仪表板，它们依赖于当前用户。所以我们不知道在编译时要加载哪些小部件。也就是说，状态也将为这些小部件提供动态字段。我为每个小部件都有一个reducer。如何组合所需的小部件的所有减少器？

我的州可能看起来像：

{ dashboardId: 12,
  widgetList:{

      w1: {
          widgetTitle:'widget 1'
          data:[]
       },
       w2:{
          widgetTitle:'widget 2'
          data:[]

       }   
  }
}

现在我想结合Reducers：

combineReducers({
  w1:widget1Reducer,
  w2:widget2Reducer
})

现在，问题是我们不知道将为当前仪表板加载哪些小部件。

Answer 1

您无需使用帮助程序组合多个reducer。创建一个widgetList reducer，使用适当的widget reducer更新到指定的widget：

function widgetList(state = {}, action) {
  switch (action.type) {
    case WIDGET_A_FOO:
    case WIDGET_A_BAR:
      return {
        ...state,
        [action.id]: widgetA(state[action.id], action),
      }

    case WIDGET_B_BAZ:
      return {
        ...state,
        [action.id]: widgetB(state[action.id], action),
      }

    case DELETE_WIDGET:
      return _.omit(state, action.id)

    default:
      return state
  }
}

在上面的示例中，action.id包含窗口小部件ID。 widgetA和widgetB是窗口小部件A和窗口小部件B的缩减器。

减速器的动态组合

1 个答案: