跳到主要内容

useCountDown

React State Hooks that return the minutes gracefull

Usage​

实时编辑器

function Demo() {
  const now = new Date();
  const tomorrow = new Date();
  tomorrow.setDate(now.getDate() + 1);
  tomorrow.setHours(0, 0, 0, 0);
  const diffInSec = Math.floor((tomorrow.getTime() - now.getTime()) / 1000);

  // note: If your app is running in server side, must pass the same time as the client
  // this demo is not running in server side
  const [hour, minute, second] = useCountDown(diffInSec);
  return (
    <div suppressHydrationWarning={true}>{`${hour}:${minute}:${second}`}</div>
  );
};
结果
Loading...

API​

useCountdown​

Returns​

readonly [string, string, string]: 包含以下元素的元组：

  • 小时。
  • 分钟。
  • 秒数。

Arguments​

参数名描述类型默认值
time时间差number (必填)-
format时间格式化函数((num: number) => [string, string, string]) | undefinedHH MM SS
callback倒计时结束的回调函数(() => void) | undefined-