Call conditional hooks

[cakctus]

I have hook useGetGenerationsQuery exported from createApi whitch make get request.
getGenerations: build.query({
query: (generationId,) => /cars-generations/${generationId},
}),

In my function component i want call this hook conditional, for exemple when user click button , after this, this hook will be make request for server. How can i get this but not when component is rendering

[liornz]

Hi,
You can use conditional fetching with the skip option.

https://redux-toolkit.js.org/rtk-query/usage/conditional-fetching

Inside the component you manage a local skip state which is initially true and give it to the hook in the options.

const { data } = useGetGenerationsQuery(id, {
skip,
});

So the request will not be made when the component initially renders.

After pressing your button set the skip state to false. Then the request will be made.

[cakctus]

Hi, You can use conditional fetching with the skip option.

https://redux-toolkit.js.org/rtk-query/usage/conditional-fetching

Inside the component you manage a local skip state which is initially true and give it to the hook in the options.

const { data } = useGetGenerationsQuery(id, { skip, });

So the request will not be made when the component initially renders.

After pressing your button set the skip state to false. Then the request will be made.

Thanks for answer, but my logic is a little more complex, I wanna make call my hooks non by click but by onChange Event, every time when user make click on my html option list. For example

<select
onChange={(event) => handleList(event)}
>

...

HandleList is trigger

[liornz]

I see what you mean.
I posted a similar question and I think the simple solution would be if the query hooks, like the mutation hooks, would give back a trigger function that we could call conditionally when needed.

[phryneas]

You can either use useLazyQuery, which comes with a trigger function, or just something like

const [arg, setArg] = useState(skipToken)
const result = useQuery(arg)

and then use setArg as the trigger.