make an api call only on button click
make an api call only on button click
8 Replies
Hi @jash.s. I'm kapa.ai, your friendly support bot. I will try to answer your question by searching through the knowledge base. :wave:
----------------------
In refine, making an API call on button click depends on the data provider you are using. You can use data hooks to make these API calls. Unfortunately, the provided knowledge sources do not contain a specific example of making an API call on button click.
However, you can refer to the data hooks documentation on how to pass custom headers and adjust data provider if necessary: Data Hooks Documentation (https://refine.dev/docs/data/hooks/use-show/#usage)
For more immediate guidance and support, consider joining the Discord channel mentioned in the discussion (https://github.com/refinedev/refine/discussions/5718). There, you can interact with an AI bot that can assist you with various questions and queries.
----------------------
Note: you can ask me a follow up question by @ mentioning me again :speech_balloon:
----------------------
<@1129363768661516329> kapa.ai is still learning and improving, please let us know how it did by reacting below
conscious-sapphire•6mo ago
is there a hook like mutate to make an api call on when a button is click @kapa.ai
Let me check the knowledge base for you. One moment! :books:
----------------------
Yes, there are several hooks in Refine that you can use to make API calls when a button is clicked. These hooks include
useCreate
, useUpdate
, useDelete
, and useCustomMutation
. Each of these hooks returns a mutate
function that you can use to make the API call.
Here's a basic example of how you can use the mutate
function from the useCustomMutation
hook to make an API call when a button is clicked:
In this example, when the button is clicked, it will trigger the handleClick
function, which calls the mutate
function to make the API call.
Please note that useCustomMutation
should not be used when creating, updating, or deleting a resource. For these operations, you should use the useCreate
, useUpdate
, or useDelete
hooks respectively.
For more information, you can refer to the useCustomMutation documentation (https://refine.dev/docs/data/hooks/use-custom-mutation).
----------------------
Note: you can ask me a follow up question by @ mentioning me again :speech_balloon:
----------------------<@1129363768661516329> kapa.ai is still learning and improving, please let us know how it did by reacting below
conscious-sapphire•6mo ago
@kapa.ai it is a get call
Let me check the knowledge base for you. One moment! :books:
----------------------
If you want to make a GET request when a button is clicked, you can use the
useQuery
hook from React Query, which is used under the hood by Refine. Here's a basic example:
In this example, useQuery
is set to not run automatically by setting enabled
to false
. When the button is clicked, it triggers the handleClick
function, which calls refetch
to make the API call.
Please note that this is a general React Query usage and not specific to Refine. In Refine, data fetching is usually handled by resource-based hooks like useList
or useOne
. If you want to make a custom API request, you can use the useCustom
hook. For more information, you can refer to the Data Fetching documentation (https://refine.dev/docs/guides-concepts/data-fetching).
----------------------
Note: you can ask me a follow up question by @ mentioning me again :speech_balloon:
----------------------<@1129363768661516329> kapa.ai is still learning and improving, please let us know how it did by reacting below