score:0
You are trying to catch the Promise.reject and wrapping it in a try...catch
. Only one of this will work.
You can either catch a promise rejection or wrap the promise in a try...catch
and throw a new error on promise rejection and catch it in catch block.
Try this code
const url = FIVE_DAY_FORECAST_URL.replace("{0}", city);
axios.interceptors.response.use(function (response) {
return response;
}, function (error) {
return Promise.reject(error);
});
try {
const request = axios.get(`${url}`)
.then(
response => {
debugger;
})
.catch(
e => {
debugger;
throw e // throw the error and catch it
});
debugger;
return {
type: FETCH_FIVE_DAY_FORECAST,
payload: request
};
} catch {
debugger;
// Now you can catch the error in catch block
console.log("Error!");
}
// or you can't write async/await code
// make the the function is marked as `async`
try {
const response = await axios.get(`${url}`)
return {
type: FETCH_FIVE_DAY_FORECAST,
payload: response
};
} catch (e) {
console.error("Error happened during fetch");
console.error(e);
}
score:3
When using try...catch
with axios
you explicitly have to state the error response like so
catch(error) {
console.log('[error]', error.response);
// use the error.response object for some logic here if you'd like
}
Otherwise it just returns the string value.
With that response object you can then utilize some logic to do something based on the particular error. More info can be found here https://github.com/axios/axios/issues/960
I hope this helps.
Source: stackoverflow.com
Related Query
- reactjs try catch in render does not catch children errors
- Axios.catch does not catch network/console errors
- Why does React.js axios data show in console but not on the screen?
- React front end is not communicating with spring boot REST API. Axios network err in console
- Axios does not catch and send data to client side
- Redux Forms submit validation does not set errors messages
- Semantic-ui-react library does not work; no errors
- axios get params does not inherit the params in create
- Why does chrome dev tools console show a link for Post 500 error in one website but not another?
- Yarn Workspaces, workspace does not emit errors or warnings
- Request made with axios does not work but if it works with XMLHttpRequest
- Yup and useForm validation errors does not trigger when contact is form is empty
- OnClick is not working, but no errors appear in the console
- react Todo list erases in console but does not erase from screen
- Axios with firebase does not return the data while putting it
- Axios then, catch are not called
- Webpack hot module replacement lists updated React components in console but does not update them
- Cannot access data property of Axios response object after successful GET request: Property 'data' does not exist on type 'void'
- axios does not work with while fetch does
- I just used react context, why does static context not work if I console on other components
- Axios post does not send data
- React Query return undefined data while in network tab the data exists but it does not show on the page
- TypeScript errors in React Class Component property does not exist on type 'Readonly<{}>', not sure how to set types for state
- React + Axios - Data loaded able to console log but not showing up in DOM?
- React Native release apk does not fetch data from local network
- React axios post request does not send the data
- Starting a php session from react with an axios call does not keep the session alive, but doing it with postman works just fine
- My dynamic API path for Axios does not appear to be formed correctly
- React not importing file. Console shows no errors
- Data comes into console but does not show in application
More Query from same tag
- React fetch, “credentials: include”, breaks my entire request and I get an error
- How to get the exact error message of JsDoc in reactjs?
- React component with react-router inside an app with react-router
- React class methods overriding
- How to listen to children length changes in React?
- React/Redux chaining a second API request and dispatch
- Why useEffect warns for the fields that I do not need to put in the dependencies array?
- JSX files in create-react-app
- react router pass data
- how to change the result of a map by another format React
- Jest + React Loadable error Not supported
- Uncaught SyntaxError: Unexpected token export (Redux)
- npx create-react-app myapp generates FETCH_ERROR
- React component isn't updating on socket.io event
- React Redux applyMiddleware invalid number of arguments
- onChange on React componet not changing state inside it's parent
- Server rendered React ExpressJS frontend leaking users' Redux store data
- Truffle Unbox Error while using truffle unbox react
- React tsx nested array print data in console but not in HTML
- Why onchange function not working with semantic class
- React Native build: Error while merging dex archives
- React | How to check if the initial state is changed
- Line Chart Js x-axis values all 0 on React
- How to use JSX file in Yii2 Asset Bundle
- React.js i18n dynamically change language
- Typescript React Redux - property does not exist on Action type
- Change date format in antd <DatePicker />
- Preact.js - How to start a auto re run server like React.js does
- Change Parent State from Child Component in React (No Redux)
- Can't call setState on a component that is not yet mounted, even though it is?