Learn React with TypeScript 3

Handling errors

1. Let's adjust the URL in our request:

.get<IPost[]>("https://jsonplaceholder.typicode.com/postsX")

If we look at the running app, the posts are no longer being rendered.

2. We want to handle this situation and give the user some feedback. We can do this using a catch method:

axios  .get<IPost[]>("https://jsonplaceholder.typicode.com/postsX")  .then( ... )  .catch(ex => {    const error =      ex.response.status === 404        ? "Resource not found"        : "An unexpected error has occurred";    this.setState({ error });  });

So, unlike fetch, HTTP status error codes can be handled in the catch method. The error object argument in catch contains a response property containing information about the response, including the HTTP status code.

3. We just referenced ...