react-async-call v0.5.1

react-async-call

Overview

Declarative promise handling in React.

Install

Using npm

npm i react-async-call --save

Then, use it as usual:

// using ES6 modules
import createAsyncCallComponent from 'react-async-call'

// using CommonJS modules
var createAsyncCallComponent = require('react-async-call').createAsyncCallComponent

UMD build

The UMD build is also available on unpkg:

<script src="https://unpkg.com/react-async-call"></script>

The package is avalable on window.ReactAsyncCall

Usage

Basic Usage

• JavaScript Example
• TypeScript Example

import createAsyncCallComponent from 'react-async-call'

const AsyncCall = createAsyncCallComponent(value => Promise.resolve(42))

const Example = () => (
  <AsyncCall>
    <AsyncCall.Running>
      <div>Loading...</div>
    </AsyncCall.Running>
    <AsyncCall.HasResult>{result => <div>The result of function call is {result}</div>}</AsyncCall.HasResult>
    <AsyncCall.Rejected>{reason => <div>Error: {reason}</div>}</AsyncCall.Rejected>
  </AsyncCall>
)

Data Fetching

• JavaScript Example
• TypeScript Example

Incremental Data Fetching

• JavaScript Example
• TypeScript Example

API

See API reference here

Change Log

You can find change log here

Credits

Great thanks to @kitos and @ventrz for their invaluable help, support and bright ideas!