https://github.com/t1amat9409/react-query

From a medium article by Tim Kolberger, https://medium.com/@TimKolb/creating-a-reusable-react-query-component-for-your-rest-api-1aa91ef2551b
https://github.com/t1amat9409/react-query

api fetch query react react-native

Last synced: about 2 months ago
JSON representation

From a medium article by Tim Kolberger, https://medium.com/@TimKolb/creating-a-reusable-react-query-component-for-your-rest-api-1aa91ef2551b

• Host: GitHub
• URL: https://github.com/t1amat9409/react-query
• Owner: t1amat9409
• License: mit
• Created: 2018-12-03T08:44:40.000Z (about 6 years ago)
• Default Branch: master
• Last Pushed: 2018-12-03T09:16:17.000Z (about 6 years ago)
• Last Synced: 2024-11-08T02:11:17.033Z (3 months ago)
• Topics: api, fetch, query, react, react-native
• Language: JavaScript
• Homepage:
• Size: 5.86 KB
• Stars: 2
• Watchers: 2
• Forks: 0
• Open Issues: 0
• Metadata Files:
  • Readme: README.md
  • License: LICENSE

Awesome Lists containing this project

README

        
# @itxbornfire/react-query

From Tim's article, and the codesandbox he peovided, this is how a basic component should look like.

Of course you can style it as you wish as shown here https://codesandbox.io/s/92n5zmoq2y?from-embed .

```JavaScript

  import React, { Fragment } from "react";

  import { Query } from "@itxbornfire/react-query";

  

  import {

    LoadingComponent,

    ErrorComponent

  } from ".../path/to/your/components";

  export const BasicQuery = () => (

    

      
BasicQuery

      

        {({ state: { data, loading, error }, actions }) => {

          if (loading) {

            return ;

          }


          if (error) {

            return ;

          }

          if (data) {

            return (

              

                

                  Reload

                

                {

                  //render your data

                }

              

            );

          }

          return null;

        }}

      

    

  );

  

```

Here's an interactive sandbox, the original sandbox by Tim himself.

[![Edit 92n5zmoq2y](https://codesandbox.io/static/img/play-codesandbox.svg)](https://codesandbox.io/s/92n5zmoq2y)