react-api-hook v1.0.3

react-api-hook

This package was created to simplify the handling of REST calls in React.

To use this package, simply declare it in the component, inserting the endpoint and possible configurations (headers, body, etc.) and call it with the appropriate sendRequest function.

The state of the call can be read from the state variable.

Finally, to cancel the request, instead, it is sufficient to call the cancelRequest function.

The state of the call has the following values:

• idle
• loading
• success
• failure
• inAbort
• canceled

In case it is success or failure, it will also have the properties data and error respectively.

Example:

import React,  {  useEffect  }  from  "react";
import useAPIHook from  "react-api-hook";

function  App()  {
    const  [status,  send,  cancel]  =  useAPIHook(
	    "https://jsonplaceholder.typicode.com/posts",
	    {  method:  "GET"  },
    );
    
    useEffect(()  =>  {
	    if (status.status  ===  "success") {
		    console.log(status.data);
		    //status.data.json() for the body of response  
	    }
	    if(status.status  ===  "failure") {
		    console.log(status.error);
	    }
    }, [status]);
    
    return (
	    <div  className="App">
			<header  className="App-header">
				<div>{status.status}</div>
			    <div>
				    <button  onClick={send}>start fetching</button>
				    <button  onClick={cancel}>stop fetching</button>
			    </div>
			</header>
	    </div>
    );
}

export  default  App;