axios-react

🌐 HTTP client component for React based on Axios

Programming language: TypeScript

Tags: Code Design     Props From Server    

Latest version: v2.0.2

README

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 send a request on the component mount.

Related links

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

Support: