从React Admin中的同一端点创建多个资源以应用不同的过滤器
我需要在React Admin中创建不同的路由,所有这些都基于相同的端点,但使用不同的过滤器。我的需求是,我需要一个菜单条目以显示所有属性=已批准的属性,所有属性=评论等等。 我尝试这样做:
export default function App() {
return (
<Admin
loginPage={CustomLoginPage}
dataProvider={dataProvider}
authProvider={authProvider}
>
<Resource
name="properties"
options={{ label: 'Properties in review' }}
icon={UserIcon}
list={PropertyReviewList}
show={PropertyShow}
edit={PropertyEdit}
/>
<Resource
name="properties"
options={{ label: 'Properties Approved' }}
icon={UserIcon}
list={PropertyApprovedList}
show={PropertyShow}
edit={PropertyEdit}
/>
</Admin>
);
}
但这并不是仅仅是最后一个定义的属性所显示的。实现我要实现的目标的最佳方法是什么?
I need to create different routes in React admin, all based on the same endpoint but with a different filter. My need is that I need a Menu entry to show all properties with status = approved, all properties with status = review and so on.
I tried doing this:
export default function App() {
return (
<Admin
loginPage={CustomLoginPage}
dataProvider={dataProvider}
authProvider={authProvider}
>
<Resource
name="properties"
options={{ label: 'Properties in review' }}
icon={UserIcon}
list={PropertyReviewList}
show={PropertyShow}
edit={PropertyEdit}
/>
<Resource
name="properties"
options={{ label: 'Properties Approved' }}
icon={UserIcon}
list={PropertyApprovedList}
show={PropertyShow}
edit={PropertyEdit}
/>
</Admin>
);
}
but this is not working as only the last defined property is showing. What is the best way to achieve what I am trying to achieve?
如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。

绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱,如果其他用户或者作者回复了您的评论,将不能在第一时间通知您!
发布评论
评论(2)
如果我正确理解您,则需要一个组件来呈现不同的数据,具体取决于可以更改的链接的某些部分。
这可以使用查询参数来实现。这是来自React路由器文档的交互式代码示例,可实现您的需求:
https://v5.reactrouter.com/web/web/example/query-parameters
因此,您将为您的页面提供一个链接,例如“/properties?status =评论”查询参数在哪里。您在组件中检查它以显示数据的值
If I understood you correctly, you need a component that renders different data depending on some part of the link that can change.
This can be achieved using query params. Here is an interactive code example from react router docs that does what you need:
https://v5.reactrouter.com/web/example/query-parameters
So, you will have a link for your page like "/properties?status=review" where status is the query param. You check it in your component to show data depending on its value
状态=已批准,所有具有状态的属性=查看
查询中输入这些属性。示例:
将这些API调用您需要的地方。您可以在后端有一个控制器来处理这两个请求。
status = approved, all properties with status = review
Enter these properties in query. Example:
Makes these api calls where you need it. You can have a single controller in backend to handle both the requests.