我在我正在从事的项目中使用 reactjs 和通量架构。我对如何将嵌套数据正确分解到存储中以及为什么我应该将数据拆分到多个存储中感到有些困惑。

为了解释这个问题，我将使用这个例子：

想象一个有项目的 Todo 应用程序。每个项目都有任务，每个任务都可以有注释。

该应用程序使用 REST api 检索数据，返回以下响应：

{
    projects: [
        { 
            id: 1, 
            name: "Action Required",
            tasks: [
                {
                    id: 1,
                    name: "Go grocery shopping",
                    notes: [
                        {
                            id: 1,
                            name: "Check shop 1"
                        },
                        {
                            id: 2,
                            name: "Also check shop 2"
                        }
                    ]
                }
            ]
        },
    ]
}

虚拟应用程序的界面在左侧显示项目列表，当您选择一个项目时，该项目将变为活动状态，其任务显示在右侧。当您单击一个任务时，您可以在弹出窗口中看到它的注释。

我会做的是使用 1 个单一的商店，“项目商店”。一个动作向服务器发出请求，获取数据并指示商店用新数据填充自己。商店内部保存了这个实体树（项目 -> 任务 -> 注释）。

为了能够根据选择的项目显示和隐藏任务，我还会在商店中保留一个变量“activeProjectId”。基于此，视图可以获取活动项目、其任务并呈现它们。

问题解决了。

然而：在网上搜索了一下，看看这是否是一个好的解决方案后，我看到很多人说你应该为每个实体使用一个单独的商店。

这意味着：一个 ProjectStore、TaskStore 和 NoteStore。为了能够管理关联，我可能还需要一个“TasksByProjectStore”和一个“NotesByTaskStore”。

有人可以解释为什么这会更好吗？我唯一看到的是管理商店和数据流的大量开销。