Eu a utilizo de forma um pouco diferente. Veja como a uso:
service/api.js
import axios from "axios";
const api = axios.create({
baseURL: "http://localhost:3001/api",
headers: {
"Content-Type": "application/json"
},
});
export default api
queries/users.js
import { useQuery } from "react-query";
import api from "../../service/api";
async function getUsers(ctx) {
const [, page ] = ctx.queryKey
const { data } = await api.get('/user', { params: { page } })
return data
}
export default function useFetchGetUsers(page) {
return useQuery(['user', page], getUsers, { refetchOnWindowFocus: false})
}
pages/user.js
import useFetchGetUsers from "queries/users";
export const User = () => {
const { isError, isLoading, data } = useFetchGetUsers(1)
return (
<div>
</div>
);
}
Olá Jevilson
!
Gostei muito da forma com que você faz suas chamadas API.
Em alguns projetos que dou manutenção fazemos da exata mesma forma, é ótimo!
Obrigado pelo seu comentário!