react-hooks-time-limit
TypeScript icon, indicating that this package has built-in type declarations

1.0.6 • Public • Published

react-hooks-time-limit

npm

React Hook for get seconds to the target time

Instrallation

You can install the package from npm.

$ npm install react-hooks-time-limit

or

$ yarn add react-hooks-time-limit

Usage

This is the simplest example.

import React from "react";
import { useTimeLimit } from "react-hooks-time-limit";

const getTomorrow = (): Date => {
  const date = new Date(Date.now());
  date.setDate(date.getDate() + 1);
  return date;
}

const Component: React.FC = () => {
  const tomorrow = getTomorrow();
  const [ timeLeft, setTargetTime ] = useTimeLimit(tomorrow, { isSec: true });

  const handleChangeDate = (event: React.ChangeEvent<HTMLInputElement>) => {
    const date = new Date(event.target.value)
    setTargetTime(date)
  }

  return (
    <div>
      <h2>{timeLeft} seconds left until the target time</h2>
      <p>change target time</p>
      <input type="date" onChange={handleChangeDate}/>
    </div>
  );
};
Parameter Default Type Description
intervalTime 1000 int Time interval to update the remaining time (optional)
isSec false boolean Returns seconds if true, ms if false (optional)

License

MIT © shu20031026

Package Sidebar

Install

npm i react-hooks-time-limit

Weekly Downloads

9

Version

1.0.6

License

MIT

Unpacked Size

6.82 kB

Total Files

15

Last publish

Collaborators

  • shu20031026