I am working with vue-query (but I guess the answer for my question would also be complied with react query) with the call to API, in which I have a button to select between auto-refetch and manual one. I have my ref autoRefresh set to true at the start

const autoRefresh = ref(true);

and I keep query settings as computed

const querySettings = computed<UseQueryOptions>(() => {
return {
    queryKey: ["vehicles"],
    queryFn: async () => (await getData.call()).data,
    refetchInterval: () => (autoRefresh.value ? 1000 * 20 : false),
    refetchOnWindowFocus: "always",
    refetchIntervalInBackground: false,
    refetchOnReconnect: "always",
    cacheTime: 1000 * 20,
  };
});
const getQuery = tanstackQuery.useQuery(querySettings.value);

However, after setting autoRefresh from true to false, useQuery is refetched once more after these 20 seconds, then stops refetching, but setting autoRefresh back to true does nothing. How can I listen to autoRefresh change for proper refetchInterval value update? (avoiding one extra refetch after changing boolean true -> false, enabling 20 second interval back after changing boolean false -> true)