How to manually run query

[AnJ-Github]

Hello, I'm trying to use Vue Query for handling login form. I'm trying to call refetch() manually in a submit function but I'm getting an error: This expression is not callable.

I have something like this:

<script setup lang="ts">
const useAuthQuery = (credentials: Credentials) => useQuery(['auth'], () => getAuthToken(credentials), {
  refetchOnWindowFocus: false,
  enabled: false,
});

const {
  isFetching, data, isError, error, refetch,
} = useAuthQuery(credentials);


function onSubmit() {
  refetch(); // error "This expression is not callable."
  // ...
}
</script>

Full error looks like this:

This expression is not callable.
  Type 'Ref<(<TPageData>(options?: (RefetchOptions & RefetchQueryFilters<TPageData>) | undefined) => Promise<QueryObserverResult<string, unknown>>)>' has no call signatures.ts(2349)

In React Query it seems to work fine:
https://stackoverflow.com/questions/62340697/react-query-how-to-usequery-when-button-is-clicked

[AnJ-Github]

Ok, I got it.

useQuery is returning refs, so instead of refetch() it should be refetch.value().