react-hot-loading

Made with create-react-library

Install

npm install --save react-hot-loading

Usage

App.js

import React from 'react'
import {LoadingProvider} from 'react-hot-loading'
import YourLoading from './YourLoading'
import Hello from './Hello'

export default function App(){
  return (
      <>
        <LoadingProvider loading={<YourLoading />}/>
        <Hello/>
      </>
  )
}

Hello.js

import React  from 'react'
import { setLoading, asyncLoading } from 'react-hot-loading'

export default () => {
  const onClick = () =>
    new Promise(resolve => {
      setTimeout(() => {
        resolve()
      }, 2000)
    })

  return (
    <div>
      <button
        onClick={async () => {
          setLoading(true)
          await onClick()
          setLoading(false)
        }}
      >
        usage1
      </button>
      <button
        onClick={asyncLoading(onClick)}
      >
        usage2
      </button>
    </div>
  )
}

Demo

https://codesandbox.io/s/inspiring-bhaskara-7yutx?file=/src/Hello.js

License

MIT © min9nim