useCustom with different values

how to fetch different set of data using useCustom when state changes?

5 Replies

Hi @japope_. I'm kapa.ai, your friendly support bot. I will try to answer your question by searching through the knowledge base. :wave: ---------------------- You can fetch a different set of data using the useCustom hook when the state changes by triggering a new request when the properties passed to useCustom are changed. Here is a basic usage example:

import { useCustom, useApiUrl } from "@refinedev/core";  

const apiUrl = useApiUrl();  

const { data, isLoading } = useCustom({  
 url: `${apiUrl}/posts-unique-check`,  
 method: "get",  
 config: {  
 query: {  
 title: "Foo bar",  
 },  
 },  
});

import { useCustom, useApiUrl } from "@refinedev/core";  

const apiUrl = useApiUrl();  

const { data, isLoading } = useCustom({  
 url: `${apiUrl}/posts-unique-check`,  
 method: "get",  
 config: {  
 query: {  
 title: "Foo bar",  
 },  
 },  
});

In this example, if the url or method properties change, the useCustom hook will trigger a new request. If you want to fetch data based on a state change, you can pass the state variable as a dependency to the useCustom hook. When the state variable changes, the useCustom hook will trigger a new request. For more complex scenarios, you can use the queryOptions property of useCustom to control when the query is enabled. For example, you can set queryOptions: { enabled: false } to initially disable the query, and then use the refetch function to manually trigger the query when needed. This approach was discussed in a Github issue (https://github.com/refinedev/refine/issues/2407) related to refine. For more information, you can refer to the useCustom documentation (https://refine.dev/docs/data/hooks/use-custom). ---------------------- Note: you can ask me a follow up question by @ mentioning me again :speech_balloon: ----------------------

kapa.ai•7mo ago

<@465923409973477386> kapa.ai is still learning and improving, please let us know how it did by reacting below

fascinating-indigo•7mo ago

@kapa.ai I want to use useCustom where the url can change

kapa.ai•7mo ago

Let me check the knowledge base for you. One moment! :books: ---------------------- You can use the useCustom hook in refine where the URL can change. The useCustom hook triggers a new request when the properties passed to it are changed. This includes the url property. Here is a basic usage example:

import { useCustom, useApiUrl } from "@refinedev/core";  

const apiUrl = useApiUrl();  

const { data, isLoading } = useCustom({  
 url: `${apiUrl}/posts-unique-check`,  
 method: "get",  
 config: {  
 query: {  
 title: "Foo bar",  
 },  
 },  
});

import { useCustom, useApiUrl } from "@refinedev/core";  

const apiUrl = useApiUrl();  

const { data, isLoading } = useCustom({  
 url: `${apiUrl}/posts-unique-check`,  
 method: "get",  
 config: {  
 query: {  
 title: "Foo bar",  
 },  
 },  
});

In this example, if the url property changes, the useCustom hook will trigger a new request. You can change the url property based on your application's state or props. When the state or props that the url depends on changes, the useCustom hook will automatically trigger a new request with the updated url. For more information, you can refer to the useCustom documentation (https://refine.dev/docs/data/hooks/use-custom). ---------------------- Note: you can ask me a follow up question by @ mentioning me again :speech_balloon: ----------------------

kapa.ai•7mo ago

<@465923409973477386> kapa.ai is still learning and improving, please let us know how it did by reacting below