use-promise-call's Introduction

use-promise-call

a React hook for state around promise

Install

// use yarn
yarn add use-promise-call
// use npm
npm install use-promise-call

API

usePromiseCall

usePromiseCall(asyncMethod, parameters, options?) => { data, error, loading, reload }: usePromiseCall hooks to manage async status inside
- asyncMethod: The method to run async
- parameters: The initial parameters to asyncMethod, or function to get initial parameters
- options: config
  - manual: boolean flag to manual trigger async method
    
    default: false
  - initial：initial data value
    
    default: null
  default : { interval = 100 }

result

data: promise resolve value
error: promise reject value
loading: status of async method
reload(parameters?): method of re-run async method
run(parameters?): method of manual trigger async method

Demo

Base

const productId = '1'
const {data: product } = usePromiseCall(loadProduct, productId)
return product && <div>{product.name}</div>

Parallel

const productId = '1'
const {data: product } = usePromiseCall(loadProduct, productId)
const {data: comments } = usePromiseCall(loadProductComments, productId)
return product && <div>{product.name}</div>

Dependent

const productId = '1'
const {data: product, loading: productLoading} = usePromiseCall(loadProduct, productId)
const {data: store, loading: storeLoading} = usePromiseCall(loadStore, () => product.store.id)
return product && <div>{product.name}</div>

Recommend Projects