取出一个减速器，而不将其他部件分组(可以处理"the rest states"的减速器)

Question

假设我想拥有以下状态结构：

{
  deep: { ... },
  foo: 0,
  bar: 0,
  str: ''
}

deep可能很复杂，所以我想为它提取一个专用还原

const deepReducer = (state = {}, action) => { ... }

以及其余部分（foo，bar and str），只需为它们使用另一个还原器，因为它们很简单

const initialState = { foo: 0, bar: 0, str: '' } // May also need to add deep here
const defaultReducer = (state = initialState, action) => { ... }

但是，这种结构似乎不起作用，如果使用组合量会对其他还原器进行分组，则该结构将变为：

{
  deep: { ... },
  others: {
    foo: 0,
    bar: 0,
    str: '',
  }
}

，但我不想分组它们，因为他们的关系不太牢固。

是否可以在2个还原器中实现此？或唯一的解决方案是为每个状态（FOO，bar and str）创建一个专用还原器？

Answer 1

我觉得您应该首先解决国家管理问题。然后，适当地分配还原器会更容易。

tldr 保持还原器尽可能简单，并使用状态归一化和选择器的组合，以确保您不会不必要地使还原器复杂化。

状态管理

作为文档状态

在该顶级对象中组织数据的最常见方法是将数据进一步分为子树，其中每个顶级键代表相关数据的某些"域"或"切片"。

首先，重要的是要了解您的整个应用程序实际上只有一个还原功能

您状态树中的每个叶子（数据切片）都应具有自己的专用还原器。这是因为每个叶子代表分组数据的给定域。将此状态视为数据库。每个叶子将代表一个分组数据表。

状态归一化

您说您的州有一个深嵌套的对象。

 {
  deep: { ... },
  foo: 0,
  bar: 0,
  str: ''
}

，而不是担心如何在此状态形状周围构造您的还原器，而是尝试在第一例中简化状态树。

如果将状态归一化，这将降低状态对象中的嵌套水平。因此，还原器不必处理深层的筑巢水平，因此更简单。

记住，在编码简单时是美。

选择器

您的状态包含您应用程序中数据的最小表示。

，如果您尽了最大的努力，您的状态中有一个深深嵌套（复杂）的物体，则您会雇用选择器。如果您不使用选择器，那么您的还原器将需要知道如何从状态中提取信息。这将在还原器中添加不兼职逻辑，并膨胀它们破坏我们的应用模块化。

通过使用选择器，我们可以以模块化的方式从状态计算派生数据，因为可以重复使用和组成选择器。

我们如何使用选择器？

使用我们状态的类比作为前端数据库。选择器代表我们获取数据的查询

选择器示例

文档的此示例使用流行的重新选择库来创建选择器。在此示例中，从我们状态计算的派生数据是实际可见的托多斯。过滤列表是从我们的所有TODO项目的列表中得出的，当前可见性过滤器可以设置为所有人，无或已启用。

const getKeyword = (state) => state.keyword
const getVisibleTodosFilteredByKeyword = createSelector(
  [ getVisibleTodos, getKeyword ],
  (visibleTodos, keyword) => visibleTodos.filter(
    todo => todo.text.indexOf(keyword) > -1
  )
)

如果我们没有执行此待办滤波器操作，则我们必须在状态下存储过滤后的烟道，并每次更改可见性过滤器时更新stae。