T
TanStack•3y ago
robust-apricot

Read only query ?

I have a page with a lot of "lazy loaded" components (each components represents a game match data) that will make a request with tanstack query. The list of requests is "known in advance" but we can't know how many are loaded if any at all. At the top of my page I want to make a "resume" card with statistics that sums up the data of all the loaded ones. Since it's about game matches, let's say 20 matches loaded, I want to be able to retrieve all data and write "12 wins / 8 losses" and so on.. It looks like I can get my data with queryClient.getQueryData which returns either undefined or my data but it does not allow me to "subscribe" to data changes if a query loaded, is there a workaround ? TLDR: I want to be able to subscribe to queries without having to do the query
4 Replies
funny-blue
funny-blue•3y ago
useQueries maybe?
robust-apricot
robust-apricotOP•3y ago
But won't that actually emit all the requests ? Let's say I have an array of 50 match ids, I don't want to do 50 requests at once (one match per request is actually the best for performance in my use case, instead of a request with many matches), I only want to load them when user scrolls and be able to read only the data if available elsewhere, only knowing the query keys
funny-blue
funny-blue•3y ago
You can set enabled: false on the useQueries observers, in which case they won't fetch by themselves
robust-apricot
robust-apricotOP•3y ago
oh I didn't think about that, the data state still gets updated from other queries ? I'll take a look at that šŸ‘Œ it works wonderfully

Did you find this page helpful?