CountDown 倒计时

用于实时展示倒计时数值,支持毫秒精度。## 代码演示

基础用法

支持day日,hour时,minute分,second秒,属性表示倒计时总时长。

<hd-count-down :day="day" />
<hd-count-down :hour="hour" />
<hd-count-down :minute="minute" />
<hd-count-down :second="second" />
const day = 2
const hour = 48
const minute = 48 * 60
const second = 48 * 60 * 60

倒计时样式

showday 属性表示是否显示天,默认为 true, showColon 属性标识是否展示分隔符,默认为 truefalse 为文字 时分秒

<hd-count-down :second="second" :showday="false" />
<hd-count-down :second="second" :showColon="false" />
const second = 30 * 60 * 60

主题

backgroundColor 属性表示时间背景颜色,borderColor 属性表示边框颜色,color 属性表示字体颜色,splitorColor 属性表示分隔符颜色,支持 HEX,RGB 和常用颜色字符串。

<hd-count-down :second="second" backgroundColor="#000000" borderColor="rgb(0,0,0)" color="black" backgroundColor="red" />
const second = 30 * 60 * 60

Props

NameDescriptionTypeRequiredDefault
showDay控制展示天Booleanfalse默认值是:true
showColon是否展示分隔符Booleanfalse默认值是:true
backgroundColor背景色Stringfalse默认值是:#FFFFFF
borderColor边框颜色Stringfalse默认值是:#000000
color字体颜色Stringfalse默认值是:#000000
splitorColor分隔符颜色Stringfalse默认值是:#FFFFFF
dayNumberfalse默认值是:0
hourNumberfalse默认值是:0
minuteNumberfalse默认值是:0
second默认值是:0false0

Events

Event NameDescriptionParameters
timeup倒计时结束时触发-