Blog>
Snippets

Invalidating Queries with React Query DevTools

Provide a code example illustrating the process of invalidating queries using React Query DevTools, to ensure data refetching for updated information.
import { useQueryClient } from 'react-query';
First, import useQueryClient from React Query within your component.
const queryClient = useQueryClient();
Instantiate the queryClient using the useQueryClient hook for accessing the query cache.
queryClient.invalidateQueries('todos');
Invalidate queries with the 'todos' query key to ensure data is refetched. This snippets can be placed inside an event handler or useEffect depending on when you want the invalidation to occur.