Axios React

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

Installation

Yarn:

$ yarn add axios-react

npm:

$ npm i -S axios-react

Live example

Online Playground

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>
);

Arguments

Name	Type	Description
loading	boolean	Request loading.
response	object	The response for a request contains the Axios response schema.
error	object	The error for a request.
refetch	function	Refetch method for a request.
networkStatus	string	Network Connection Status.

Props

Name	Type	Default value	Options	Description
config	object	None	Axios request config options	Config options for making requests.
skip	boolean	false	true or false	Disable sending requests when mounting the component.

Read more

• The easiest way to create HTTP requests in React.js

Support