Redux嵌套状态设计

当前有一个越来越复杂的状态，我想知道如果我做错了，请参阅下面的示例我正在使用的减速器。Redux嵌套状态设计

case RECEIVE_DEPARTMENT_DAYDATA: 
    return { 
     ...state, 
     departments: { 
      ...state.departments, 
      [action.payload.targetDepartment]: { 
       ...state.departments[action.payload.targetDepartment], 
       dayData: { 
        ...state.departments[action.payload.targetDepartment].dayData, 
        [action.payload.day]: { 
         ...state.departments[action.payload.targetDepartment].dayData[action.payload.day], 
         [action.payload.targetField]: { 
          ...action.payload.data, 
          isFetching: false, 
          receivedAt: new Date(), 
          didInvaldiate: false, 
          didCall: true 
         } 
        } 
       } 
      } 
     } 
    };

将dayData移动到自己的reducer还是没有区别？

来源

2017-02-18 NealVDV

在我看来，这需要一个大的重构。任何人都无法在合理的时间内阅读和理解这些内容。当您最终从原始状态传播大量属性时，这是一个好兆头，您可能还需要更改数据结构。 –

@BalázsÉdes这就是我的想法。我是设计邦的新手，所以任何帮助都是值得欢迎的。基本上我有'每个部门''dayData'。这个'dayData'也有键。 – NealVDV

有什么办法可以让你的数据减少“嵌套”？在不同的集合中处理实体，并通过id或其他东西引用它们？也许退房[normalizr]（https://www.npmjs.com/package/normalizr） –

我的建议是将你的状态正常化为平坦状态。

你应该看一看到：https://github.com/paularmstrong/normalizr 而看到丹·阿布拉莫夫对理论家视频约正火终极版状态：https://egghead.io/lessons/javascript-redux-normalizing-api-responses-with-normalizr

这个书生气十足的教训是我学到了如何管理Redux的状态是最重要的事情之一我强烈建议您阅读并阅读关于此事的更多信息。

最近的Twitter发布了自己的移动网站与反应和终极版，并有一个文章解剖自己的状态，这也可能是一个有趣的阅读：https://medium.com/statuscode/dissecting-twitters-redux-store-d7280b62c6b1#.2e55tu6wb

来源

2017-02-18 17:54:05 Canastro

不知道他有一个教程系列！请检查一下，谢谢！ – NealVDV

你不可改变的嵌套数据更新的例子是正确的。然而，@Canastro也是正确的 - 这是一个正常化的好候选人。

我鼓励你通过在终极版文档http://redux.js.org/docs/faq/OrganizingState.html#organizing-state-nested-data和http://redux.js.org/docs/recipes/StructuringReducers.html阅读，以及一些在我React/Redux links list的Redux Techniques#Normalization部分的文章。

来源

2017-02-19 18:20:03 markerikson

Redux嵌套状态设计

回答

相关问题