https://github.com/loicmahieu/react-fetchy

https://github.com/loicmahieu/react-fetchy

Last synced: about 1 month ago
JSON representation

• Host: GitHub
• URL: https://github.com/loicmahieu/react-fetchy
• Owner: LoicMahieu
• License: mit
• Created: 2018-09-14T08:41:56.000Z (over 6 years ago)
• Default Branch: master
• Last Pushed: 2019-02-06T09:23:25.000Z (almost 6 years ago)
• Last Synced: 2024-11-30T01:57:06.200Z (about 2 months ago)
• Language: TypeScript
• Size: 307 KB
• Stars: 2
• Watchers: 4
• Forks: 1
• Open Issues: 0
• Metadata Files:
  • Readme: README.md
  • License: LICENSE.md

Awesome Lists containing this project

README

        

# react-fetchy

[![Build Status](https://travis-ci.org/LoicMahieu/react-fetchy.svg?branch=master)](https://travis-ci.org/LoicMahieu/react-fetchy)

[![npm](https://img.shields.io/npm/v/react-fetchy.svg)](https://www.npmjs.com/package/react-fetchy)

react-fetchy is a React component that let makes fetch call easily by using "Function as Child components" pattern. Built on top of [`superagent`](http://visionmedia.github.io/superagent/).

### Example

#### Single

##### Fetch on mount

```js

import { Fetchy } from "react-fetchy";

const PostList = () => (

  

    {({ fetch, state: { value: todos } }) => (

      


        
Todos

        Refresh

        


          {(todos || []).map(todo => 
{todo.title}
)}

        

      

    )}

  

);

```


See [CodeSandbox](https://codesandbox.io/s/pjrrk8nqrx)

##### Manual fetch

```js

const PostList = () => (

  

    {({ fetch, state: { value: todos } }) => (

       {

        fetch({

          url: "https://jsonplaceholder.typicode.com/todos",

        });

      }}>Fetch me

    )}

  

);

```

##### Options

See [`interface IFetchyRequestOptions`](./src/Fetchy.tsx#L19-L30)

#### Multi

##### Fetch on mount

```js

import { FetchyMulti } from "react-fetchy";

const PostList = () => (

  

    {({ states }) => 
{JSON.stringify(states, null, 2)}
}

  

);

```


See [CodeSandbox](https://codesandbox.io/s/n500mq8k1j)

##### Options

See [`interface IFetchyMultiOptions`](./src/FetchyMulti.tsx#L25-L28)

## License

MIT