vant/docs/markdown/use-count-down.en-US.md

useCountDown

Intro

Used to manage the countdown.

Usage

Basic Usage

<span>Total time：{{ current.total }}</span>
<span>Remain days：{{ current.days }}</span>
<span>Remain hours：{{ current.hours }}</span>
<span>Remain minutes：{{ current.minutes }}</span>
<span>Remain seconds：{{ current.seconds }}</span>
<span>Remain milliseconds：{{ current.milliseconds }}</span>

import { useCountDown } from '@vant/use';

export default {
  setup() {
    const countDown = useCountDown({
      time: 24 * 60 * 60 * 1000,
    });

    countDown.start();

    return {
      current: countDown.current,
    };
  },
};

Millisecond

import { useCountDown } from '@vant/use';

export default {
  setup() {
    const countDown = useCountDown({
      time: 24 * 60 * 60 * 1000,
      millisecond: true,
    });
    countDown.start();

    return {
      current: countDown.current,
    };
  },
};

API

Type Declarations

type CurrentTime = {
  days: number;
  hours: number;
  total: number;
  minutes: number;
  seconds: number;
  milliseconds: number;
};

type CountDown = {
  start: () => void;
  pause: () => void;
  reset: (totalTime: number) => void;
  current: ComputedRef<CurrentTime>;
};

type UseCountDownOptions = {
  time: number;
  millisecond?: boolean;
  onChange?: (current: CurrentTime) => void;
  onFinish?: () => void;
};

function useCountDown(options: UseCountDownOptions): CountDown;

Params

Name	Description	Type	Default Value
time	Total time, unit milliseconds	number	-
millisecond	Whether to enable millisecond render	boolean	false
onChange	Triggered when count down changed	(current: CurrentTime) => void	-
onFinish	Triggered when count down finished	-

Return Value

Name	Description	Type
current	Current remain time	CurrentTime
start	Start count down	() => void
pause	Pause count down	() => void
reset	Reset count down	(time?: number): void

CurrentTime Structure

Name	Description	Type
total	Total time, unit milliseconds	number
days	Remain days	number
hours	Remain hours	number
minutes	Remain minutes	number
seconds	Remain seconds	number
milliseconds	Remain milliseconds	number