title: React-Query and Query Invalidation Question
body: <p>I don't really know how to ask clearly but, I will paste my code first and ask below.</p>
  <pre><code>function useToDos() {
    const queryCache = useQueryCache();
    const fetchTodos = useQuery(
      'fetchTodos',
      () =&gt; client.get(paths.todos).then(({ data }: any) =&gt; data),
      { enabled: false }
    );
  
    const createTodo = async ({ name ) =&gt;
      await client.post(paths.todos, { name }).then(({ data }) =&gt; data);
  
    return {
      fetchTodos,
      createTodo: useMutation(createTodo, {
        onMutate: newItem =&gt; {
          queryCache.cancelQueries('fetchTodos');
          const previousTodos = queryCache.getQueryData('fetchTodos');
          queryCache.setQueryData('fetchTodos', old =&gt; [
            ...old,
            newItem,
          ]);
          return () =&gt; queryCache.setQueryData('fetchTodos', previousTodos);
        },
      }),
    };
  }
  </code></pre>
  <p>As you can see, I am trying to create my own custom hooks that wrap react-query functionality. Because of this, I need to set my <code>fetchTodos</code> query to be disabled so it doesn't run right away. However, does this break all background data fetching?</p>
  <p>Specifically, when I run <code>createTodo</code> and the <code>onMutate</code> method triggers, I would ideally like to have the <code>fetchTodos</code> query update in the background so that my list of todos on the frontend is updated without having to make the request again. But it seems that with the query initially set to be disabled, the background updating doesn't take effect.</p>
  <p>As I don't think wrapping react-query hooks into a library of custom hooks is a very great idea, I will probably have more questions about this same setup but for now, I will start here. Thank you. </p>