use-pulse

A React hook to spit out a sequential value at a time interval for a given number of times.

Install

npm install --save use-pulse

Usage

import React, { Component } from 'react'
import { usePulse } from 'use-pulse'

const Example = () => {

        const min = 0           // value to start at
        const max = 100         // value to end at
        const increment = 1     // increment added at every pulse
        const interval = 1000   // pulse interval in milliseconds
        const delay = 500       // delay in milliseconds before first increment
        
        const myPulse = usePulse(min, max, increment, interval, delay)
        // This will create a pulse that will count from min = 0 to max = 100 (inclusive of both ends)
        // with increment = 1 after an initial delay = 500 milliseconds and at an interval = 1000 miliseconds.

        // To start the pulse
        // myPulse.start()

        // To pause or stop the pulse
        // myPulse.stop()

        // To reset the pulse value back to min and stop there
        // myPulse.reset()

        // To restart the pulse from the current value
        // myPulse.start()

        // To get the current value of the pulse
        // myPulse.value

        return (
            <div>
                <div>Pulse Value: {myPulse.value}</div>
                <div>
                    <button onClick={myPulse.reset}>Reset</button>
                    <button onClick={myPulse.start}>Start</button>
                    <button onClick={myPulse.stop}>Stop</button>
                </div>
            </div>
        )
}

License

MIT © samirdamle

This hook is created using create-react-hook.