https://github.com/wizyma/react-fetch

React component that integrate the fetch api inspired by apollo-client
https://github.com/wizyma/react-fetch

fetch-api javascript react

Last synced: 4 months ago
JSON representation

React component that integrate the fetch api inspired by apollo-client

• Host: GitHub
• URL: https://github.com/wizyma/react-fetch
• Owner: Wizyma
• License: mit
• Created: 2018-04-10T11:36:31.000Z (about 7 years ago)
• Default Branch: master
• Last Pushed: 2018-05-12T16:24:59.000Z (about 7 years ago)
• Last Synced: 2025-01-05T00:22:06.039Z (5 months ago)
• Topics: fetch-api, javascript, react
• Language: JavaScript
• Size: 94.7 KB
• Stars: 4
• Watchers: 2
• Forks: 0
• Open Issues: 0
• Metadata Files:
  • Readme: README.md
  • License: LICENSE

Awesome Lists containing this project

README

        
# react-fetch

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

[![codecov](https://codecov.io/gh/Wizyma/react-fetch/branch/master/graph/badge.svg)](https://codecov.io/gh/Wizyma/react-fetch)

React component that integrate the fetch api inspired by apollo-client 

## Usage 

```javascript

// by default the GET method is used

import React, { Component, Fragment } from 'react'

import Fetch from 'react-fetch'

import MyErrorComponent from './error-component'

import LoadingComponent from './loading'

class MyComponent extends Component {

  render() {

    return(

      

        
My Fetch component will be a child who will load asynchronously the data !

        

          {({ error, data, loading }) => {

            if(error) return 

            if(loading) return 


            if(data) {

              return (

                data.map(({ id, title, body }) => (

                  


                    
{title}

                    
{body}

                  

                ))

              )

            }

          }}

        

      

    )

  }

}

```


You can use all the `http` verbs. The Fetch component has optionals parameters such as `credentials` and `headers`.

Do not hesitate to make a pull request or make some suggestions. 

PR are welcome :heart: