Callback success and error function

Author: Satish Yadav

src/components/RQSuperHeroes.page.jsx

@@ -3,22 +3,29 @@ import React from 'react';
 import { useQuery } from '@tanstack/react-query';
 
 const fetchSuperHeroes = () =>
-	axios.get('http://localhost:4000/superheroes').then(res => res.data);
+	axios.get('http://localhost:4000/superheroesd').then(res => res.data);
 
 function RQSuperHeroesPage() {
+	const onSuccess = () => {
+		console.log('Perform side effect after data fetching');
+	};
+	const onError = () => {
+		console.log('Perform side effect after getting error');
+	};
 	const { isLoading, data, isError, error, isFetching, refetch } = useQuery(
 		['super-heros'],
 		fetchSuperHeroes,
-        {
-            enabled: false
-        }
+		{
+			onSuccess,
+			onError,
+		},
 	);
 
 	return (
 		<>
 			<h2>Super Heroes Page</h2>
-            <button onClick={refetch}>Fetch Heros data</button>
-            {isFetching && (<h4>Updating...</h4>)}
+			<button onClick={refetch}>Fetch Heros data</button>
+			{isFetching && <h4>Updating...</h4>}
 			{isLoading ? (
 				<h3>Heros data Loading...</h3>
 			) : isError ? (