Error Handling

useEffect(() => {
async function fetchPlaces() {
setIsFetching(true);
try {
const places = await
fetchAvailablePlaces();

navigator.geolocation.getCurrentPosition((position)=> {
const sortedPlaces = sortPlacesByDistance(
places,
position.coords.latitude,
position.coords.longitude
);
setAvailablePlaces(sortedPlaces);
setIsFetching(false);
})

} catch(error) {
setError({
message:
error.message || 'Could not fetch places, please try again later'});
}
setIsFetching(false);
}
fetchPlaces();

}, [])

if(error) {
return(

);
}

** Separate file for fetching and getting data **

export async function fetchAvailablePlaces(){
const response = await
fetch('http://localhost:3000/places');
const resData = await response.json();

  if(!response.ok) {
    throw new Error('Failed to fetch places');
  }

 return  resData.places;

}

I would like to know how is this approach to handle error while building react app.

The above is the detailed content of Error Handling. For more information, please follow other related articles on the PHP Chinese website!