T
TanStack•3y ago
rare-sapphire

How to refetch partial data?

Hi o/ I'm new to working with react-query and I'm not sure how to best handle this problem: I have a useQuery hook that calls my api which returns an object like this: 
{
  "invites": [...],
  "members": [...],
  "roles": [...],
  "...": "...",
}
{
  "invites": [...],
  "members": [...],
  "roles": [...],
  "...": "...",
}
On initial page load, I want to fetch everything. On a button click, I'd like to call the api with some additional parameters which restricts the response to only invites or members or roles. I could have a query hook for each key, but this seems cumbersome. Is there a way to modify the queryFn to take in some parameter so I can pass that along to the api?
1 Reply
fascinating-indigo
fascinating-indigo•3y ago
variables should be part of the QuerKey: https://tanstack.com/query/v4/docs/react/guides/query-keys#if-your-query-function-depends-on-a-variable-include-it-in-your-query-key
Query Keys | TanStack Query Docs
At its core, TanStack Query manages query caching for you based on query keys. Query keys have to be an Array at the top level, and can be as simple as an Array with a single string, or as complex as an array of many strings and nested objects. As long as the query key is serializable, and unique to the query's data, you can use it! Simple Que...

Did you find this page helpful?