需要有关正确使用React / Redux的建议

时间:2016-09-02 14:43:57

标签: reactjs redux

例如,我们的项目减速器中的状态S1如下:

| - Item1 - Item1.1 | - Item1.2 | - Item2 | - Item3 - Item3.1 - Item3.2 - Item3.3

每个项目都有自己的州财产(开放/关闭)。 我们有完美呈现此状态的组件,一切正常。

然后我们需要在这里添加一个更多的抽象级别,Groups。 我们将其实现为功能并获得新状态:

S2 = f(S1)

例如,S2,如下所示:

| - Group1 - Item3.1 | - Item1.2 | - Group2 - Item2

我们希望使用相同的组件渲染它,但Group1,Group2需要自己的状态(开放/关闭属性的值),并且不清楚应该以Redux的形式存储此状态。

提前感谢任何想法/建议。

1 个答案:

答案 0 :(得分:0)

将状态存储为与UI相同的状态听起来太复杂了。我会用父键跟踪父项在每个项目上的任何内容:

items: [
  { name: 'Item 1', parent: 'Group 2' },
  { name: 'Item 2.3', parent: 'Group 4' }
]

然后您可以根据UI组件的名称在UI中过滤它们。给定一个您调用'Group 2'的组件,您可以使用filter找到您想要的组件:

items.filter(item => item.parent === 'Group 2')

当然这只是伪代码。您可以设置一个无状态组件,该组件包含可以在任何地方重用的项目和父名称。

如果我指出你正确的方向,请告诉我!