Using only the object format

In v4 of React Query, most custom hooks and functions were overloaded to support previous patterns. This means that in your code, both of the useQuery hooks in the following snippet would be the same thing:

const { data } = useQuery({
    queryKey: ["api"]
    queryFn: fetchData,
});
const { data } = useQuery(["api"], fetchData);

As you can see from the preceding snippet, we create a query with queryKey ["api"] and queryFn fetchData twice. This is because the second and first examples are just instances of the same hook that has been overloaded.

With the introduction of v5, the second example shown in the preceding snippet is no longer supported; therefore, you can only use your hooks by passing them a single object with the needed options. Here is the syntax that you need to follow from now on:

useQuery({ queryKey, queryFn, ...options })
useMutation({ mutationFn, ...options...