Redux Store 的结构应该是怎样的？

Question

Redux.org告诉您要规范化您的状态，但这会造成一些混乱。

它告诉我们应该有以下格式的状态：

{
    simpleDomainData1: {....},
    simpleDomainData2: {....},
    entities : {
        entityType1 : {....},
        entityType2 : {....}
    },
    ui : {
        uiSection1 : {....},
        uiSection2 : {....}
    }
}

我可以通过两种方式实现这一目标。

案例 1：我有 3 个页面，主页、创建、提要页面。因此，我可以创建 homeReducer.js、createReducer.js、feedsReducer.js，每个化简器将具有 simpleDomainData1、simpleDomainData2、entities 和 ui。

情况 2：我可以为每个字段创建单独的减速器，例如 simpleHomeReducer.js、simpleCreateReducer.js、simpleFeedsReducer.js、entitiesReducer、uiReducer.js。

但我不明白哪种方法是正确的，为什么？

Answer 1

嘿 kiran，正如您在问题中提到的，您有两种方法来构造您的减速器。

但是，我会给你一个新的方法。

首先，这听起来很棘手，但一旦你稍微思考一下，对于这个项目和未来来说，这都是小菜一碟。

您应该使用combineReducers组合减速器以使其易于使用。

1.uiReducer

首先，您应该为 uiSection1 创建减速器uiSection1，并在其中拥有来自主组件的所有逻辑，仅为 uiSection1 创建组件并提供组件。

就像您创建uiSection2减速器一样，并在其中创建与 uiSection2 相关的所有页面的所有组件逻辑。

现在将这 2 个减速器合并为一个减速器uiReducer。

2.实体减速器

现在，对 做同样的事情entityType。创建 2 个entityType 减速器并将它们合并为一个enitityReducer。

3. 域数据缩减器

现在为域数据创建每个减速器并将其组合为 1 个减速器domainDataReducer

现在你有3个reducers ui、entity和domainData。

4. rootReducer

现在，将这 3 个减速器合并为 1 个减速器rootReducer，并将其传递给index.js

最后一件事，您应该为所有减速器操作执行单独的逻辑。在此减速器操作中，您还可以对后端进行 api 调用。

这是 TheNetNin​​ja 的 YouTube 视频的链接