Skip to content

Rotarepmi/react-timers-hooks

Repository files navigation

React Timers Hooks npm version License TypeScript

The useInterval/useTimeout custom React hooks accepts 2 arguments - your callback function and delay value which can be a Number or null.

When delay is set to null the timer is cleared, Number value represents timeout in milliseconds.
When delay has changed during the countdown, the tick resets and starts again with new delay value.

Built with TypeScript.

Installation

npm i react-timers-hooks

or

yarn add react-timers-hooks  

Basic usage

import { useInterval, useTimeout } from "react-timers-hooks";

...
useInterval (
    () => {
        doSomething();
    },
    5000
);

useTimeout (
    () => {
        doSomething2();
    },
    2000,
);

Usage with conditionals

import { useInterval, useTimeout } from "react-timers-hooks";

...
const [interval, setInterval] = useState(false);
const [waitAndGo, waitAndGo] = useState(false);

useInterval (
    () => {
        doSomething();
    },
    interval ? 5000 : null,
);

useTimeout (
    () => {
        doSomething2();
    },
    waitAndGo ? 2000 : null,
);

License

MIT

About

React reusable hooks for Timeout and Interval

Resources

License

Stars

Watchers

Forks

Packages

No packages published