## 基本用法 通过 `time` 属性设置倒计时总时长,单位为毫秒。组件默认会自动开始倒计时。 ## 自定义格式 通过 `format` 属性设置倒计时的显示格式,支持以下占位符: - `DD`:天数 - `HH`:小时(自动补零) - `mm`:分钟(自动补零) - `ss`:秒数(自动补零) - `SSS`:毫秒(3 位) - `SS`:毫秒(2 位) - `S`:毫秒(1 位) 如果格式中不包含 `DD`,天数会自动累加到小时中。 ## 毫秒级渲染 设置 `millisecond` 属性可以开启毫秒级渲染,此时组件会以更高的频率更新显示内容。 注意:开启毫秒级渲染会增加性能开销,请根据实际需求使用。 ## 手动控制 设置 `autoStart` 为 `false` 可以禁用自动开始。通过 `bind:this` 获取组件实例后,可以调用以下方法手动控制倒计时: - `start()`:开始倒计时 - `pause()`:暂停倒计时 - `reset(time?)`:重置倒计时,可选传入新的时间 ## 自定义样式 通过 `children` Snippet 可以完全自定义倒计时的显示内容。Snippet 会接收一个 `TimeData` 对象作为参数,包含 `days`、`hours`、`minutes`、`seconds`、`milliseconds` 属性。 ## 事件回调 - `onfinish`:倒计时结束时触发 - `onchange`:倒计时变化时触发,参数为当前的 `TimeData` 对象 ## 页面可见性处理 组件内部使用 `requestAnimationFrame` 实现精准计时,并监听页面可见性变化。当页面切换到后台时,倒计时会自动校准,确保计时准确。 ## CSS 注入 通过 `injClass` 参数可以向 CountDown 组件注入 CSS 类名,实现更多自定义样式。