title: React Query useQuery & Axios
body: <p>I'm trying to create an API function with a help of React Query and Axios.
  When I'm using useQuery with vanilla fetch function - it all works perfectly.</p>
  <pre><code>export const useGetDebts = async () =&gt; {
    const { families } = appStore.user;
    const res = useQuery(&quot;getDebts&quot;, async () =&gt; {
      const res = await fetch(`${API_URL}/api/family/${families[0]}/debts`, {
        method: &quot;GET&quot;,
        headers: {
          Authorization: `Bearer ${appStore.token ?? &quot;&quot;}`,
        },
      });
      const parsedBody: DebtsResponse = await res.json();
      return parsedBody;
    });
    return res;
  };
  </code></pre>
  <p>But when I switch the vanilla fetch function to Axios - I get an error status of 500 (not sure if it comes from React Query or Axios).</p>
  <pre><code>export const useGetDebts = async () =&gt; {
    const { families } = appStore.user;
    const res = useQuery(&quot;getDebts&quot;, async () =&gt; {
      const res = await axiosInstance.get&lt;DebtsResponse&gt;(`/api/family/${families[0]}/debts`);
      return res.data;
    });
    return res;
  };
  </code></pre>
  <p>Thanks in advance for any explanations/suggestions.</p>
  <p>P.s. The axiosInstance works fine with the useMutation hook. So it only makes me more confused. =(</p>
  <pre><code>export const useGetDebt = () =&gt; (
    useMutation(async (id: number) =&gt; {
      const { families } = appStore.user;
      const res = await axiosInstance.get&lt;DebtResponse&gt;(`/api/family/${families[0]}/debts/${id}`);
      return res.data;
    })
  );
  </code></pre>
  <p>P.s.s. I'm working with React Native if it's somehow relevant.</p>