Waiting for queries to become stale before they are fetched again doesn't always work, especially when you know for a fact that a query needs to get refetched. For that purpose, the
queryCache has an
invalidateQueries method that lets you manually mark queries as stale and potentially refetch them too!
Note: Where other libraries that use normalized caches would attempt to update local queries with the new data imperatively, React Query gives you the tools to avoid the manual labor that comes with maintaining normalized caches and instead prescribes invalidation, background-refetching and ultimately atomic updates.
When a query is invalidated with
invalidateQueries, two things happen:
useQueryand friends), it will also be refetched in the background
When using APIs like
removeQueries (and others that support partial query matching), you can match multiple queries by their prefix, or get really specific and match an exact query.
In this example, we can use the
todos prefix to invalidate any queries that start with
todos in their query key:
You can even invalidate queries with specific variables by passing a more specific query key to the
invalidateQueries API is very flexible, so even if you want to only invalidate
todos queries that don't have any more variables or subkeys, you can pass an
exact: true option to the
If you find yourself wanting even more granularity, you can pass a predicate function to the
invalidateQueries method. This function will receive each query object from the queryCache and allow you to return
false for whether you want to invalidate that query: