Package Exports

react-countdown-hook

This package does not declare an exports field, so the exports above have been automatically detected and optimized by JSPM instead. If any package subpath is missing, it is recommended to post an issue to the original package (react-countdown-hook) to support the "exports" field. If that is not possible, create a JSPM override to customize the exports field for this package.

Readme

react-countdown-hook

React countdown hook.

Installation

Using npm:

$ npm install --save react-countdown-hook

Using yarn:

$ yarn add react-countdown-hook

Usage

import React from 'react';
import useCountDown from 'react-countdown-hook';

const initialTime = 60 * 1000; // initial time in milliseconds, defaults to 60000
const interval = 1000; // interval to change remaining time amount, defaults to 1000

const render = () => {
  const [timeLeft, start] = useCountDown(initialTime, interval);
  
  // start the timer during the first render
  React.useEffect(() => {
    start();
  }, []);
  
  const restart = React.useCallback(() => {
    // you can start existing timer with an arbitrary value
    // if new value is not passed timer will start with initial value
    const newTime = 42 * 1000;
    start(newTime);
  }, [start]);
 
  return (
    <>
      <p>Time left: {timeLeft}</p>
 
      <button onClick={restart}>
        Restart counter with 42 seconds
      </button>
    </>
  );
}

Check out more usage examples in playground.

API

useCountDown(timeToCount?: number, interval?: number): [number, (timeToCount?: number) => void]

Contributing

Feel free to submit any issues or pull requests.

License

MIT