Javascript Redux-主/细节状态形状

目前，我的主细节视图有一个这样的状态形状

paychecks: {
 summary: {},
 details: {},
};

其中summary包含一个项目数组，details将包含从API获取的每个项目的详细信息

文件夹结构

/paychecks
  index.js
  /summary
   actions.js
   reducers.js
   index.js
  /details
   actions.js
   reducers.js
   index.js

在我看来，我有两个独立的屏幕。主视图连接到

摘要

状态，而详细视图连接到

详细信息

状态。这很好用

我目前面临的问题是，要求在主视图页面的顶部显示第一张工资单的工资单详细信息。在这种情况下，我需要按此顺序执行以下操作：

从API获取工资支票列表

从API获取工资支票[0]的详细信息

---

我知道我应该为此使用redux thunk中间件，但由于摘要和详细信息都是从彼此封装的，我不确定摘要的操作创建者调用详细信息操作创建者是否有意义。我是否应该在paychecks级别创建一个action creator，依次调用fetchPaychecks（）和fetchPaycheckDetails（）？

是否可以为每个paycheck项目添加详细信息，并在需要时延迟加载<代码>薪水=[{summary:”，详细信息：{}，{summary….这将使不可能状态成为不可能。拥有摘要数组并希望在某个点拥有与summary长度和顺序相同的详细信息数组容易出错。