react-async-button-z

1.0.5 • Public • Published

react-async-button-z

react-async-button-z

LIVE EXAMPLE

Description
  • Simple lock button.
Usage
npm install --save react-async-button-z

Import the module in the place you want to use:

import AsyncButton from "react-async-button-z";
import "react-async-button-z/build/styles.css";

Snippet

    // handler by props
    const [isAsync, setAsync] = useState(false)

    const fetchApi() {
        setAsync(true)
        fetch('')....finally(() => setAsync(false))
    }

    <AsyncButton isAsync={isAsync} onClick={fetchApi} text="abcd" />
    // handler by async Promise
    const fetchApi = () => {
        return new Promise(resovle => {
            // do something
            setTimeout(() => {
                // make done
                resovle()
            }, 5000)
        })
    }

    <AsyncButton asyncFunc={fetchApi} text="abcd" loadingText="loading" />
Props
props type description
className String
theme String default: ring
indicatorColor String default: #000000
size Number default: 10 (indicator size)
isAsync boolean your handler async by props (change true /false )
onClick func your handler async by props
text any better if it is string label
loadingText any when async
timeout number if auto make icon async (default: 0 => none)
asyncFunc func your handler async by a promise
Note

Example

LIVE EXAMPLE

A working example can be found in the example directory.

npm install
npm run dev
npm run start

License

MIT

Package Sidebar

Install

npm i react-async-button-z

Weekly Downloads

0

Version

1.0.5

License

MIT

Unpacked Size

26.2 kB

Total Files

6

Last publish

Collaborators

  • delpikye