英文:
How can I search Supabase database in React Admin using ilike instead of eq filter?
问题
我有一个与我的Supabase数据库连接的React Admin应用程序。在这个数据库中,我有一个名为“posts”的表。我的目标是能够通过React Admin搜索这些帖子的标题。
例如,我有两篇帖子{id:1, title: "第一篇帖子"}和{id:2, title: "第二篇帖子"}. 当我使用以下代码搜索"第二篇"时:
const postFilters = [
<TextInput source="title" label="按标题搜索" alwaysOn />,
];
export const PostList = () => (
<List filters={postFilters}>
<Datagrid>
<TextField source="id" />
<TextField source="title" />
<EditButton />
<ShowButton />
</Datagrid>
</List>
);
它不会返回任何结果,因为它要求严格的相等性。如果我将"第二篇帖子"作为搜索词输入,它将给我期望的结果。
我尝试将我的<TextInput/>
更改为<SearchInput />
,如下所示:<SearchInput source="title" alwaysOn />
,但它没有改变任何内容。
我可以在我的数据库日志中看到这个URL:/post?title=eq.second
。我认为如果我能够将title=eq.second
更改为类似title=ilike.second
的形式,它应该可以工作,但我不知道如何做到这一点。
英文:
I have a react admin application linked to my supabase database. I have a posts table in this database. My aim is to be able to search the titles of these posts via react admin.
For example, I have two posts {id:1, title: "first post"} and {id:2, title: "second post"}. When I do a search for "second" using this code :
const postFilters = [
<TextInput source="title" label="Search by title" alwaysOn />,
];
export const PostList = () => (
<List filters={postFilters} >
<Datagrid >
<TextField source="id" />
<TextField source="title" />
<EditButton />
<ShowButton />
</Datagrid>
</List>
);
It doesn't return any results because it wants a strict equality. If I type "second post" as search term, it will give me the result expected.
I have tried to change my <TextInput/> by a <SearchInput /> like that : <SearchInput source="title" alwaysOn />
but it don't change anything.
I can see on my database logs this url : /post?title=eq.second
. I think if I can be able to change title=eq.second
to somthing like title=ilike.second
it should work but I don't know how to do it.
答案1
得分: 1
谢谢你给我检查我的 DataProvider 源代码的想法,@MaxAlex。
我使用 ra-data-postgrest
,在阅读它在 node_modules
中的 README 后,我看到我们可以简单地这样做:
<TextInput source="title@ilike" label="Search by title" alwaysOn />
。
英文:
Thank you for giving me the idea to check the source code of my DataProvider @MaxAlex.
I use ra-data-postgrest
and after reading its README in node_modules
, I saw that we can simply do this :
<TextInput source="title@ilike" label="Search by title" alwaysOn />
.
答案2
得分: 0
最终发送给服务器的请求是在您的 DataProvider 内部形成的。
您需要更改 DataProvider getList
方法的实现。
您可以以多种方式实现这一点:
-
克隆您的 DataProvider 的源代码并更改
getList
的实现。 -
以相同的方式为原始 DataProvider 实现一个包装器。
在其中更改查询参数并使用新参数调用原始 DataProvider。 -
使用withLifecycleCallbacks() 方法来装饰 DataProvider。
在beforeGetList(params, dataProvider)
内部,覆盖参数并返回新的参数。
英文:
General information about Filter Operators
The final request to server is formed inside your DataProvider.
You need to change implementation of DataProvider getList
method.
You can do this in various ways:
-
Clone the source code of your DataProvider and change the implementation of
getList
. -
Implement a wrapper for the original DataProvider in the same way.
Inside it, change the query parameters and call the original DataProvider with the new parameters. -
Use the withLifecycleCallbacks() method to decorate the DataProvider.
Inside thebeforeGetList(params, dataProvider)
, override params and return new parameters.
通过集体智慧和协作来改善编程学习和解决问题的方式。致力于成为全球开发者共同参与的知识库,让每个人都能够通过互相帮助和分享经验来进步。
评论