@react-use-hooks/use-fetch

[React-use-fetch: useFetch]

What is useFetch?

React hook to fetch data from network, with some additional awesome features.

Installation:

npm i @react-use-hooks/use-fetch --save

Code:

import React from 'react';
import ReactDOM from 'react-dom';
import { useFetch } from "@react-use-hooks/use-fetch";

function App() {
   const { fetch, data, error, fetching, status, request, response } = useFetch({
    url: "https://jsonplaceholder.typicode.com/todos/1"
   });
   return (
    <div className="App">
      <h1>React-use-hooks : useFetch</h1>
      <button onClick={() => fetch()}>Fetch Data</button>
      <p>Fetching: {fetching + ""}</p>
      <p>Status: {status}</p>
      <p>Request Method: {request?.method}</p>
      <p>Request URL: {request?.url}</p>
      <p>Response code: {response?.status}</p>
      <p>Response Text: {response?.statusText}</p>
      <p>Data: {data && JSON.stringify(data)}</p>
      <p>Error: {error && error.message}</p>
    </div>
  );
}

ReactDOM.render(<App />, document.getElementById('root'));

Demo:

Demo

Options:

url : string

License:

This project is licensed under the terms of the MIT license.