npm install react-fetch
url: where to fetch json data fromonSuccess: function on successfully fetching the dataonError: function to be called on erroroptions: object containing parameters for the request (see the fetch spec)
pass an api endpoint and the resulting object will be passed as a prop.
import React from "react";
import Fetch from "react-fetch";
function App() {
const handleError = (error) => console.log(error);
const handleSuccess = (data) => console.log(data);
return (
<Fetch
url="http://httpbin.org/headers"
onSuccess={handleSuccess}
onError={handleError}
>
<UserAgent />
</Fetch>
);
}
function UserAgent(props) {
return (
<div>
{props.headers ? (
<div>Your User-Agent: {props.headers["User-Agent"]}</div>
) : (
"Loading ..."
)}
</div>
);
}Run this to view the example in example/dist
npm install
npm run build