My api key restricts me from making more than 1 request in 5 second, so I would like to wait 5 seconds before making another request for NearbyJobs(The first request is made for PopularJobs).
<ScrollView showsVerticalScrollIndicator={false} horizontal={false}>
<View style={{ flex: 1, padding: SIZES.medium }}>
<Welcome />
<Popularjobs />
{/* {setTimeout(() => {}, 6000)} */}
<Nearbyjobs />
</View>
</ScrollView>
API Call
import { useState, useEffect } from "react";
import axios from "axios";
const useFetch = (endpoint, query) => {
const [data, setData] = useState([]);
const [error, setError] = useState(null);
const [loading, setLoading] = useState(false);
const options = {
method: "GET",
url: `https://jsearch.p.rapidapi.com/${endpoint}`,
params: { ...query },
headers: {
"X-RapidAPI-Key": "",
"X-RapidAPI-Host": "jsearch.p.rapidapi.com",
},
};
const fetchData = async () => {
setLoading(true);
try {
const response = await axios.request(options);
setData(response.data.data);
} catch (err) {
setError(err);
alert(err);
} finally {
setLoading(false);
}
};
useEffect(() => {
fetchData();
}, []);
const refetch = () => {
setLoading(true);
fetchData();
};
return { data, error, loading, refetch };
};
export default useFetch;
>Solution :
Can you try using setTimeout inside the useEffect?
useEffect(() => {
fetchData();
const timeout = setTimeout(() => {
fetchData();
}, 6000);
return () => clearTimeout(timeout);
}, []);