更新记录

1.0.1（2023-03-23） 下载此版本

组件卸载时关闭计时器

1.0.0（2023-03-22） 下载此版本

第一版

平台兼容性

如何使用

引用页面template

<ttd-countdown :end_time="end_time" @overEvent = "overEvent"></ttd-countdown>

引用页面script

    import ttdCountdown from '@/components/ttd-countdown/ttd-countdown.vue'
    export default {
        components:{
            ttdProgress
        },
        data(){
            return{
                end_time:'2023-03-31T20:52:48Z',
            }
        },
        methods:{
            overEvent(){
                console.log('倒计时结束')
            }
        }
    }

参数说明

    //必填
    //结束日期
    end_time:{
        type:String,
        default:''
    },
    //必填
    //倒计时计时结束事件
    overEvent:{
        type:Function,
        default:()=>{}
    },
    //选填
    //日数后的表述符号（下同）
    day:{
        type:String,
        default:'日'
    },
    hour:{
        type:String,
        default:':'
    },
    minute:{
        type:String,
        default:':'
    },
    second:{
        type:String,
        default:''
    },
    //选填
    //日数是否显示（下同）
    showDay:{
        type:Boolean,
        default:true
    },
    showhour:{
        type:Boolean,
        default:true
    },
    showMinute:{
        type:Boolean,
        default:true
    },
    showSecond:{
        type:Boolean,
        default:true
    },
    //选填
    //数字颜色
    timeColor:{
        type:String,
        default:'#FFF'
    },
    //选填
    //数字背景颜色
    bgColor:{
        type:String,
        default:'#007AFF'
    },
    //选填
    //表述符号颜色
    textColor:{
        type:String,
        default:'#000'
    },
    //选填
    //数字的外边距
    timeMargin: {
        type:String,
        default:'0 10rpx'
    },
    //选填
    //字号
    fontSize: {
        type:String,
        default:'26rpx'
    }