• CountDown 倒计时

    CountDown 倒计时

    倒计时组件,组件名:uni-countdown,代码块: uCountDown。

    使用方式:

    script 中引用组件

    1. import uniCountdown from "@/components/uni-countdown/uni-countdown.vue"
    2. export default {
    3. components: {uniCountdown}
    4. }

    一般用法

    1. <uni-countdown
    2. :day="1"
    3. :hour="1"
    4. :minute="12"
    5. :second="40">
    6. </uni-countdown>

    不显示天数

    1. <uni-countdown
    2. :show-day="false"
    3. :hour="12"
    4. :minute="12"
    5. :second="12">
    6. </uni-countdown>

    修改颜色

    1. <uni-countdown
    2. color="#FFFFFF"
    3. background-color="#00B26A"
    4. border-color="#00B26A"
    5. :day="1"
    6. :hour="2"
    7. :minute="30"
    8. :second="0">
    9. </uni-countdown>

    uniCountDown 属性说明:

    属性名类型默认值说明
    background-colorString#FFFFFF背景色
    border-colorString#000000边框颜色
    colorString#000000文字颜色
    splitor-colorString#000000割符号颜色
    dayNumber0天数
    hourNumber0小时
    minuteNumber0分钟
    secondNumber0
    show-dayBooleantrue是否显示天数
    show-colonBooleantrue是否以冒号为分隔符

    uniCountDown 事件说明:

    事件称名说明返回参数
    timeup倒计时时间到触发事件-

    Tips

    • 组件实际运行效果参考:https://github.com/dcloudio/uni-ui
    • npm 使用方式参考:https://ext.dcloud.net.cn/plugin?id=55