react-use-fetch
v0.0.0-alpha.1
Published
React hook for using fetch.
Downloads
31
Readme
react-use-fetch
React hook for using fetch.
Installation
Using npm:
$ npm install --save react-use-fetch
Using yarn:
$ yarn add react-use-fetch
This module uses React's upcoming hooks feature.
To try this out you'll also need to install the 16.7.0-alpha.0 version
of react
and react-dom
:
$ yarn add [email protected] [email protected]
Usage
import React from 'react';
import useFetch, { useJsonResponse } from 'react-use-fetch';
function Example() {
const { response } = useFetch('https://api.github.com/users/bsonntag');
const [json] = useJsonResponse(response);
if (!json) {
return <p>Loading...</p>;
}
if (!response.ok) {
return <p>Error: {json.message}</p>;
}
return (
<>
<h1>{json.name}</h1>
<img src={json.avatar_url} />
</>
);
}
API
useFetch(input: string | Request, init?: Object): {
error: ?Error,
response: ?Response
}
Receives the same arguments as fetch
and returns an object with the response
and the request error.
useJsonResponse(response: ?Response): [?Object, ?Error];
Receives a fetch response
and returns a tuple with the result of response.json()
and the error of parsing.
If the response is null
or undefined
nothing is done.
Contributing
Please feel free to submit any issues or pull requests.
License
MIT