Simple useFetch hook for sequential requests
npm install @josipp/use-fetchbash
npm i @josipp/use-fetch
`
Usage
`jsx
import { useEffect, useState } from 'react';
import useFetch from '@josipp/use-fetch';
const baseUrl = 'https://jsonplaceholder.typicode.com';
function App() {
const [users, setUsers] = useState(null);
const {
doFetch,
isLoading,
response,
error: { error, msg },
} = useFetch();
useEffect(() => {
doFetch([
// id is key in response object, it is optional
// options are also optional
{ url: ${baseUrl}/posts, id: 'posts' },
{ url: ${baseUrl}/users, options: { method: 'GET' } },
// you can also set to another state manager, like redux or do something else
// with data
{ func: data => setUsers(data) },
{
url: ${baseUrl}/posts,
options: {
method: 'POST',
body: JSON.stringify({ title: 'test', body: 'test', userId: 2 }),
headers: {
'Content-type': 'application/json; charset=UTF-8',
},
},
},
]);
}, [doFetch]);
if (isLoading) {
// can be used for loading indicator
return Loading...
;
}
if (error) {
console.log(msg);
return Something went wrong.
;
}
return (
<>
{JSON.stringify(response.posts)}
{JSON.stringify(response[1])}
{JSON.stringify(users)}
{JSON.stringify(response[3])}
>
);
}
export default App;
``