Lanyun Count Down
lanyun-count-down 倒计时
介绍
该组件常用于活动截止时间等,动态变化时间。
使用方法
import "../../components/lanyun-count-down/lanyun-count-down.stml";
例子
<lanyun-count-down
id="time1"
:auto="true"
@change="handleChange"
@end="handleEnd"
:timestamp="10"
separator="zh"
font-size="18px"
color="#06f"
/>
props 属性
参数 | 说明 | 类型 | 默认值 | |
---|---|---|---|---|
auto | 是否自动启动 | boolean | false | |
timestamp | 倒计时,单位为秒, 必填 | string \ | number | - |
separator | 分隔符,colon 为英文冒号,zh 为中文, 选填 |
string | colon | |
font-size | 字体大小, 选填 | string | 14px | |
color | 字体颜色, 选填 | string | #111827 | |
show-days | 是否显示倒计时的天 部分, 选填 |
boolean | true | |
show-hours | 是否显示倒计时的时 部分, 选填 |
boolean | true | |
show-minutes | 是否显示倒计时的分 部分, 选填 |
boolean | true | |
show-seconds | 是否显示倒计时的秒 部分, 选填 |
boolean | true |
events 事件
事件名 | 说明 | 回调参数 |
---|---|---|
change | 倒计时每秒触发一次 | 倒计时秒数 |
end | 当倒计时结束时触发 | - |
帮助说明
获取dom后执行start方法,详见demo中的handleStart方法
$('#time1').avmComp.start();