CountDown
一个简单的倒计时。
查看示例
使用
npm
或 yarn
安装
npm install countdown-pro
yarn add countdown-pro
浏览器引入
在浏览器中使用 script
标签直接引入文件,并使用全局变量 CountDown
。
- 该仓库的 dist 目录下提供了
countdown.umd.js
以及 countdown.umd.min.js
。 npm
包的 countdown-pro/dist
目录下也提供了 countdown.umd.js
以及 countdown.umd.min.js
。- 你也可以通过 UNPKG 进行下载。
示例
import CountDown from 'countdown-pro';
const countdown = new CountDown({
time: 60 * 1000,
interval: 1000,
onChange: (time) => {
console.log(time);
},
onEnd: () => {
console.log('结束');
}
});
countdown.start();
配置项
参数 | 说明 | 类型 | 必填 | 默认值 |
---|
time | 倒计时,单位毫秒 | number | Y | 0 |
interval | 时间间隔,单位毫秒 | number | - | 1000 |
onChange | 每次时间间隔时触发 | (currentTime) => void | - | - |
onEnd | 倒计时结束时触发 | () => void | - | - |
实例方法
方法名 | 说明 |
---|
start | 开始倒计时 |
pause | 暂停倒计时 |
reset | 重置倒计时 |
静态方法
内置一些简单日期格式方法,通过 CountDown.方法名
直接调用。
CountDown.format(timestamp, pattern='HH:mm:ss')
格式化时间,返回格式化后的时间字符串
CountDown.format(2 * 60 * 60 * 1000);
CountDown.format(2 * 60 * 60 * 1000, 'mm:ss');
参数 | 说明 | 类型 | 必填 | 默认值 |
---|
timestamp | 时间戳,单位毫秒 | number | Y | - |
pattern | 时间格式,DD-日,HH-时,mm-分,ss-秒,SSS-毫秒 | string | - | HH:mm:ss |
CountDown.padZero(num, targetLength=2)
前置补零,返回补零后的值
CountDown.padZero(2);
CountDown.parseTimeData(timestamp)
解析时间戳,返回的时间对象格式 timeData
interface TimeData {
days: number;
hours: number;
minutes: number;
seconds: number;
milliseconds: number;
}
CountDown.parseTimeData(2 * 60 * 60 * 1000);