/Javascript/React/UseFetch custom hook for React

UseFetch custom hook for React

import { useEffect, useState } from 'react';

const useFetch = (url) => {
	const [data, setData] = useState(null);
	const [isLoading, setIsLoading] = useState(true);
	const [error, setError] = useState(null);

	useEffect(() => {
		const abortCont = new AbortController();

		fetch(url, { signal: abortCont.signal })
			.then((res) => {
				if (!res.ok) {
					throw Error('Could not fetch the data for that resource');
				}
				return res.json();
			})
			.then((data) => {
				setData(data);
				setIsLoading(false);
				setError(null);
			})
			.catch((err) => {
				if (err.name === 'AbortError') {
					console.log('Fetch aborted');
				} else {
					setError(err.message);
					setIsLoading(false);
				}
			});
		return () => abortCont.abort();
	}, [url]);
	return { data, isLoading, error };
};

Similar codes

0 vote387 views1 answer
React native update app from play store ios app store
Javascript React
0 vote374 views1 answer
Ios react native detect locale
Javascript React
0 vote376 views1 answer
Textfield label language react
Javascript React
0 vote409 views1 answer
Web-vitals react
Javascript React
0 vote381 views1 answer
React download file from express res.download
Javascript React
0 vote367 views1 answer
Floating button react
Javascript React
0 vote403 views1 answer
How to disable react in jsx scope eslint
Javascript React
1 vote369 views1 answer
Button doesn't work while keyboard is shown react native
Javascript React
1 vote362 views1 answer
Implementating step component in react
Javascript React
0 vote399 views1 answer
Error: Error: Unable to resolve module `react-native-gesture-handler` from `node_modules\@react-navigation\native\lib\module\Scrollables.js`: react-native-gesture-handler could not be found within the project.
Javascript React