动态缩减器组合

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

我的状态可能看起来像：

{ dashboardId: 12, 
    widgetList:{ 

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

     } 
    } 
}

现在我想减速结合：

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

现在，这个问题是我们不知道它的所有部件都将加载当前仪表盘。

来源

2016-04-26 user1803361

您不需要使用助手合并多个缩减器。创建一个widgetList减速器，将使用适当的插件更新减速器指定小窗口：

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的缩减器。

来源

2016-04-26 19:15:46 Florent

谢谢，这很整洁:) – user1803361

我看到的唯一缺点是我们可能最终导入所有窗口小部件（〜100）的减速器。我使用的是webpack，有没有什么办法可以下载当前页面所需的reducer？ – user1803361

动态缩减器组合

回答

相关问题