Home

Awesome

<div align="center">

Axios React

NPM NPM JavaScript Style Guide

HTTP client component for React with child function callback to create async requests in render based on Axios.

</div> <br>

Installation

Yarn:

$ yarn add axios-react

npm:

$ npm i -S axios-react
<br>

Live example

Online Playground

<br>

Usage

import React from 'react';
import Request from 'axios-react';

const Demo = () => (
  <Request
    config={{
      method: 'get',
      url: 'https://jsonplaceholder.typicode.com/todos/1',
    }}
  >
    {({ loading, response, error, refetch, networkStatus }) => (
      <div>
          {networkStatus && <span>{networkStatus}</span>}
          {loading && <span>Loading...</span>}
          {error && <span>{error.response.data}</span>}
          {response && <h3>{response.data.title}</h3>}
          <button onClick={refetch}>Refetch!</button>
      </div>
    )}
  </Request>
);
<br>

Arguments

NameTypeDescription
loadingbooleanRequest loading.
responseobjectThe response for a request contains the Axios response schema.
errorobjectThe error for a request.
refetchfunctionRefetch method for a request.
networkStatusstringNetwork Connection Status.
<br>

Props

NameTypeDefault valueOptionsDescription
configobjectNoneAxios request config optionsConfig options for making requests.
skipbooleanfalsetrue or falseDisable sending requests when mounting the component.
<br>

Read more

<br>

Support

<a href="https://www.patreon.com/soroushchehresa"> <img src="https://c5.patreon.com/external/logo/become_a_patron_button@2x.png" width="160"> </a>