Invalidating dependent queries?
I've just started tinkering with Tanstack Query in React this week, and it's been an absolute joy to use. I'm building a simple weather app, and I want to give the user the opportunity to refetch data without refreshing the page. Obviously, I can use
I am getting the user's current location with the Geolocation API in a
When the user presses the refresh button, it should first retry the geolocation query. If this has changed, it will obviously fetch the new forecast. However, if it has not changed, it should still get the latest forecast. The easy solution would be to refetch both queries immediately, but I'm dealing with usage limits so I would really like to avoid fetching the latest forecast for an old location (because the refetches would be parallel).
So, how can I best implement this? Apologies if this is answered/documented somewhere already!
queryClient.invalidateQueries() for that, but I can't wrap my head around dealing with the dependent query I have.I am getting the user's current location with the Geolocation API in a
useGeolocationQuery, which is a variable in the dependent useForecastQuery. When the user presses the refresh button, it should first retry the geolocation query. If this has changed, it will obviously fetch the new forecast. However, if it has not changed, it should still get the latest forecast. The easy solution would be to refetch both queries immediately, but I'm dealing with usage limits so I would really like to avoid fetching the latest forecast for an old location (because the refetches would be parallel).
So, how can I best implement this? Apologies if this is answered/documented somewhere already!
