useQuery to populate dropdown

Hello everyone, what I'm trying to do is using the result of useQuery to populate a dropdown.
I discovered useQuery has a

select

select

parameter that I can use to perform actions when I fetch the data (but using that I cannot return data anymore, or at least I can, but if I use the

select

select

parameter to modify a global status, then I return the data from the select function, it will cause an infinite loop, as the same as modifying a global state using the returned {data} value).
My problem is: from what I understood the best-practice is to use the {data} returned from useQuery to populate my dropdown, but this dropdown is associated with a Zustand global state that keeps track of the currently-selected element. If I initialize my global state with

undefined

undefined

everything goes well, but I want to initialize my global state with one selected item right after fetching the items.
My solution would be to use the

select

select

parameter to set 2 global states: one for saving the list of elements fetched and one for saving the selected item, but this could create problems when the query is re-fetched.

I hope my problem is clear, how do you handle situations like this?

TanStack•3y ago•

5 replies

foolish-indigo

useQuery to populate dropdown

Hello everyone, what I'm trying to do is using the result of useQuery to populate a dropdown.
I discovered useQuery has a

select

select

parameter that I can use to perform actions when I fetch the data (but using that I cannot return data anymore, or at least I can, but if I use the

select

select

undefined

undefined

everything goes well, but I want to initialize my global state with one selected item right after fetching the items.
My solution would be to use the

select

select

useQuery to populate dropdown

Similar Threads

useQuery to populate dropdown

Similar Threads

Similar Threads

Similar Threads