# 8.4 倒计时（Countdown）

倒计时组件

# 实例

# 基础用法

<template>
  <dof-countdown tpl="{d}天{h}时{m}分{s}秒" :time="TIME"></dof-countdown>
</template>
<script>
    import { DofCountdown } from 'dolphin-intl-ui'
    export default {
      components: { DofCountdown },
      data: () => ({
        TIME: new Date().getTime() + 86400000 + ''
      })
    }
</script>
1
2
3
4
5
6
7
8
9
10
11
12

# Attributes

Prop Type Required Default Description
time Number N 1501200000000 最终时间戳
interval Number N 1000 间隔,单位为"毫秒"
tpl String N {h}:{m}:{s} 展示模板
timeWrapStyle Object N - 最外层包裹 style
timeBoxStyle Object N - 数字盒子 style
dotBoxStyle Object N - 符号盒子 style
timeTextStyle Object N - 数字文字 style
dotTextStyle Object N - 符号文字 style
needDarkMode Boolean N false 是否启用 M-dark/T-dark 内置暗黑适配
backgroundColor String N '' 背景色
textColor String N '' 文字颜色
dotColor String N '' 时间分隔符颜色

设置 :need-dark-mode="true" 可启用内置暗黑配色，主题初始化与构建配置见 接入说明。

颜色属性为空时使用内置配色；业务显式颜色和样式覆盖优先于默认配色，关闭暗黑适配后仍有效。

timeBoxStyle、timeTextStyle、dotTextStyle 优先于默认颜色，数字品牌色保留。

# Events

事件名 说明 回调参数
dofOnComplete 完成时调用的方法 -

← 8.5 标签（Tag） →