• Stars
    star
    120
  • Rank 295,983 (Top 6 %)
  • Language
    JavaScript
  • Created over 9 years ago
  • Updated almost 4 years ago

Reviews

There are no reviews yet. Be the first to send feedback to the community and the maintainers!

Repository Details

Component wrapper for isomorphic-fetch, passes response to children

React Fetch

Install

npm install react-fetch

Props

  • url: where to fetch json data from
  • onSuccess: function on successfully fetching the data
  • onError: function to be called on error
  • options: object containing parameters for the request (see the fetch spec)

Example

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>
  );
}

Rebuilding

Run this to view the example in example/dist

npm install
npm run build

More Repositories

1

tests

Chainable, easy to read, React testing library
JavaScript
248
star
2

ReactJSNews

Everything from reactjsnews.com :)
CSS
119
star
3

scheduler

A pure React implementation of a drag and drop scheduler
JavaScript
115
star
4

modal

a react modal that lets you easily customize the css
JavaScript
92
star
5

legible

the cleanest way to make http requests in js / node
JavaScript
47
star
6

image

an img tag, with lazy loading
JavaScript
47
star
7

redux-save

Full featured middleware for handling async actions and automagically saving data (For RN & Web)
JavaScript
32
star
8

table

the simplest, most hands-off table helper
JavaScript
31
star
9

context-menu

Replace the native right-click context menu with your own info
JavaScript
30
star
10

popover

Popovers for React
JavaScript
29
star
11

immutable-proxy

JavaScript
28
star
12

redux-tutorial

code from a tutorial
JavaScript
26
star
13

forms

Form and schema builder for React **not ready for use yet**
JavaScript
16
star
14

tabs

tabs, done right
JavaScript
14
star
15

fader

a HOC that will fade a component in and out
JavaScript
11
star
16

override-decorator

Simple override decorator for ES7
JavaScript
4
star
17

enzymed

decorators and automatic testing for enzyme by airbnb
JavaScript
3
star
18

rubyfill

An (opinionated) collection of Ruby'ish polyfills for JavaScript
JavaScript
2
star
19

accordion

A simple accordion component based on Thoughbot's accordion in refills
JavaScript
1
star
20

cards

A simple component to render cards from the Thoughtbot Refills library
JavaScript
1
star
21

id

a small utility for generating unique id's (useful for React)
JavaScript
1
star