反应管理员嵌套资源问题答案

【问题标题】：React admin nested resources issues反应管理员嵌套资源问题
【发布时间】：2020-06-04 06:08:17
【问题描述】：

我已经设置了我的 react admin 以连接到我的 nestJS 后端。对于简单的 API，一切正常，我能够正确执行 CRUD。出现以下情况时会出现问题：

我有这样定义的表 -

Pages table
Section table(foreign key -> pageId) - corresponds to the id in pages table
Widget table(foreign key -> sectionId) - corresponds to id in section table

我想将页面加载为数据网格，单击特定行时，我应该能够将其所需部分作为数据网格获取。一旦我有了这些部分，我应该能够通过单击任何部分行来获取小部件。此外，我应该能够在每个数据网格上执行 CRUD 操作。

示例 POST 请求如下：

for pages - >http://localhost:3010/config/pages
sections -  http://localhost:3010/config/pages/:pageId/sections
widgets -  http://localhost:3010/config/pages/:pageId/sections/:sectionId/widgets

请帮忙

【问题讨论】：

标签： reactjs react-redux react-router react-admin

【解决方案1】：

我认为您可以为您的Page-Record 创建一个Show-Component，其中包含ReferenceManyField。 Datagrid 可以是 ReferenceManyField 的子代。所以这可能看起来像这样：

<ReferenceManyField
    {...props}             
    reference="sections"
    target="pageId">
       <Datagrid label="Sections">
           <TextField source="id"/>
           [...]
       </Datagrid>
</ReferenceManyField>

或者，当单击页面行时，您可以链接到应用过滤器的主要部分列表，以便仅显示特定 pageId 的部分，例如通过链接到/#/sections?displayedFilters={"pageId":true}&filter={"pageId":123}。这需要您在List-Component 中设置相应的过滤器用户界面。

【讨论】：