Custom api endpoint for fetching items
Hi guys, I'm new to Refine - I wanted to know if it's possible to prevent the default fetch url to invoke when we goto a specific page?
For example, I have a resource
user
and on the list page - localhost:3000/users
I want to fetch the users from api/users/latest
and not api/users
18 Replies
Hi @krockstar. I'm kapa.ai, your friendly support bot. I will try to answer your question by searching through the knowledge base. :wave:
----------------------
Yes, you can customize the fetch URL for a specific page in Refine. You can achieve this by using a custom data provider and overriding the
getList
method for the specific resource.
Here's an example of how you can create a custom data provider:
Then, use this custom data provider in your <Refine>
component:
This will fetch users from api/users/latest
instead of api/users
when you visit the list page at localhost:3000/users
.
----------------------
Note: you can ask me a follow up question by @ mentioning me again
:speech_balloon:
----------------------<@194753773376241664> kapa.ai is still learning and improving, please let us how it did by reacting below
fascinating-indigoOP•2y ago
@kapa.ai but what about the const customUrl? Where is that used?
Let me check the knowledge base for you. One moment! :books:
----------------------
Apologies for the confusion in my previous response. I missed providing the implementation for fetching data from the custom URL. Here's the updated custom data provider with the implementation for fetching data from
customUrl
:
In this updated example, the customUrl
is used to fetch data using the httpClient.get()
method. The fetched data is then returned as the result of the getList
method for the "users" resource.
----------------------
Note: you can ask me a follow up question by @ mentioning me again
:speech_balloon:
----------------------<@194753773376241664> kapa.ai is still learning and improving, please let us how it did by reacting below
eastern-cyan•2y ago
Hey @krockstar You can do this simply by changing the resource prop.
If you use Antd;
If you use React-Table;
fascinating-indigoOP•2y ago
Awesome, I used
useDataGrid
! Thanks for this, however refine adds ?_end=10&_start=0
to the api call as query params.
However, I want it to be ?current=1&pageSize=25
. I'm passing -
Is there some other way to achieve this?
@kapa.ai how to not send _end and _start as query params to an api call?Let me check the knowledge base for you. One moment! :books:
----------------------
To prevent sending
_start
and _end
as query params in an API call, you can create a custom data provider and modify the getList
method to exclude these parameters.
Here's an example of how you can create a custom data provider:
Then, use this custom data provider in your <Refine>
component:
This custom data provider will exclude _start
and _end
from the query params when making API calls.
----------------------
Note: you can ask me a follow up question by @ mentioning me again
:speech_balloon:
----------------------<@194753773376241664> kapa.ai is still learning and improving, please let us how it did by reacting below
fascinating-indigoOP•2y ago
@kapa.ai is there a Typescript interface for the getList function in dataProvider?
Let me check the knowledge base for you. One moment! :books:
----------------------
Yes, there is a TypeScript interface for the
getList
function in the dataProvider. The getList
method is part of the DataProvider
interface in Refine. Here's the relevant part of the DataProvider
interface:
You can find more information about the DataProvider
interface and its properties in the Refine documentation (https://refine.dev/docs/api-reference/core/providers/data-provider).
----------------------
Note: you can ask me a follow up question by @ mentioning me again
:speech_balloon:
----------------------<@194753773376241664> kapa.ai is still learning and improving, please let us how it did by reacting below
fascinating-indigoOP•2y ago
@kapa.ai interface for DataProvider with getOne, create, update, deleteOne, getApiUrl
Let me check the knowledge base for you. One moment! :books:
----------------------
The
DataProvider
interface in Refine includes methods like getOne
, create
, update
, deleteOne
, and getApiUrl
. Here's the relevant part of the DataProvider
interface:
You can find more information about the DataProvider
interface and its properties in the Refine documentation (https://refine.dev/docs/api-reference/core/providers/data-provider).
----------------------
Note: you can ask me a follow up question by @ mentioning me again
:speech_balloon:
----------------------<@194753773376241664> kapa.ai is still learning and improving, please let us how it did by reacting below
fascinating-indigoOP•2y ago
@kapa.ai dataProvider object with getOne, create, update, deleteOne, getApiUrl
Let me check the knowledge base for you. One moment! :books:
@krockstar That's a great question, but unfortunately I am only capable of responding to a maximum of three questions per thread. Don't hesitate to create a new thread for any further questions you have though. I'm here to help!
rival-black•2y ago
Hey @krockstar,
You can define like below: