title: Axios handling errors
body: <p>I'm trying to understand javascript promises better with Axios. What I pretend is to handle all errors in Request.js and only call the request function from anywhere without having to use <code>catch()</code>.</p>
  
  <p>In this example, the response to the request will be 400 with an error message in JSON.</p>
  
  <p>This is the error I'm getting:</p>
  
  <p><code>Uncaught (in promise) Error: Request failed with status code 400</code></p>
  
  <p>The only solution I find is to add <code>.catch(() =&gt; {})</code> in Somewhere.js but I'm trying to avoid having to do that. Is it possible?</p>
  
  <p>Here's the code:</p>
  
  <blockquote>
    <p>Request.js</p>
  </blockquote>
  
  <pre><code>export function request(method, uri, body, headers) {
    let config = {
      method: method.toLowerCase(),
      url: uri,
      baseURL: API_URL,
      headers: { 'Authorization': 'Bearer ' + getToken() },
      validateStatus: function (status) {
        return status &gt;= 200 &amp;&amp; status &lt; 400
      }
    }
  
    ...
  
    return axios(config).then(
      function (response) {
        return response.data
      }
    ).catch(
      function (error) {
        console.log('Show error notification!')
        return Promise.reject(error)
      }
    )
  }
  </code></pre>
  
  <blockquote>
    <p>Somewhere.js</p>
  </blockquote>
  
  <pre><code>export default class Somewhere extends React.Component {
  
    ...
  
    callSomeRequest() {
      request('DELETE', '/some/request').then(
        () =&gt; {
          console.log('Request successful!')
        }
      )
    }
  
    ...
  
  }
  </code></pre>