如何将动态过滤器传递给具有"休息时管理员"的列表组件?

Question

我正在使用Show来显示学生页面。在学生页面上，我想显示许多课程的列表，并且该列表必须分页。

export const StudentShow = (props) => (
<Show title='Student' {...props}>
<SimpleShowLayout>
// correctly displays the student ID
<TextField label='id' source='id' />
<ReferenceManyField
label='Courses'
target='course'
id='student.id'
reference='courses'>
// how can I properly pass the student ID to List?
<List {...props} filter={{ student: student.id }}>
<Datagrid>
<TextField source='code' />
</Datagrid>
</List>
</ReferenceManyField>
</SimpleShowLayout>
</Show>
);

ReferenceManyField正确地对/courses/?student=<studentId>进行API调用，但是List只是调用/courses/。我无法将学生证传递给List组件。

如何将学生 ID 传递给List组件？

Answer 1

您可以在登录时将 StudentId 保存在 localStorage 中，并使用它来创建过滤器。还没有测试过这个。但我认为它应该有效。

另外，我不确定List是否是您应该作为子项传递给ReferenceManyField的组件。它应该是一个迭代器组件，如 DataGrid 或 SingleFieldList。

https://marmelab.com/admin-on-rest/Fields.html#referencemanyfield

Answer 2

我能够通过创建另一个组件来访问父记录。

const Courses = props => (
let studentRecord = props.record;
<div className='field'>
<ReferenceManyField
target='course'
reference='courses'>
<List {...props} filter={{ student: studentRecord.id }}>
<Datagrid>
<TextField label='id' source='id' />
</Datagrid>
</List>
</ReferenceManyField>
</div>
);
export const StudentShow = (props) => (
<Show title='Student' {...props}>
<SimpleShowLayout>
// correctly displays the student ID
<TextField label='id' source='id' />
<Courses {...props} />
</SimpleShowLayout>
</Show>
);