更新记录

2.0.0(2022-08-10) 下载此版本

增加v-model属性,可双向绑定计数器数值。

1.4.0(2022-08-04) 下载此版本

增加格式化方法format

1.3.0(2022-08-04) 下载此版本

1.0.0(2022-08-01)

计数器初始化

1.1.0(2022-08-02)

增加天,时,分,秒转换

1.2.0(2022-08-02)

增加测试按钮,增加前缀,监听返回秒数

1.3.0(2022-08-02)

增加前缀

查看更多

平台兼容性

Vue2 Vue3
App 快应用 微信小程序 支付宝小程序 百度小程序 字节小程序 QQ小程序
app-vue app-nvue
钉钉小程序 快手小程序 飞书小程序 京东小程序
H5-Safari Android Browser 微信浏览器(Android) QQ浏览器(Android) Chrome IE Edge Firefox PC-Safari

mryzr-timer

  • 计时器插件-------示例:【计时器:5天15:55:55】
  • 不定期优化组件
  • QQ:987212198

安装方式

本组件符合的 easycom 规范,导入可直接使用。

温馨提示:HBuilderX 2.5.5起,只需将本组件导入项目,在页面template中即可直接使用,无需在页面中import和注册components

基本用法

template 中使用组件

<template>
    <view class="container">
        <mryzr-timer ref="timer" v-model="timeCount" :testButton="false" :auto="auto" format="day天【HH:mm:ss】" @callbackTimeCode="callbackTimeCode" ></mryzr-timer>
        <view>
            <button type="default" @click="reset">重置计时器</button>
            <button type="default" @click="start">开启计时器</button>
            <button type="default" @click="clear">停止计时器</button>
            <button type="default" @click="getTime">获取当前计时秒</button>
        </view>
    </view>
</template>

<script>
    export default {
        data() {
            return {
                auto: false,
                timeCount: 3
            }
        },
        methods: {
            reset(){
                //重置计时器
                this.$refs.timer.reset()
            },
            start(){
                //开启计时器
                this.$refs.timer.start()
            },
            clear(){
                //停止计时器
                this.$refs.timer.clear()
            },
            getTime(){
                //监听计时器的秒数
                let timeCount = this.$refs.timer.getTimeCount();
                console.log(timeCount);
            }
        }
    }
</script>

API

mryzr-timer Props

属性名 类型 默认值 说明
v-model Number 0 双向绑定计数器计数秒值
testButton Boolean false 是否开启测试按钮
auto Boolean true 是否初始化开启计时器
format String day天HH:mm:ss 计时器输出格式【day天,HH小时,mm分钟,ss秒】

mryzr-timer Events

事件名 说明 返回值
@reset 重置定时器事件(refs方式调用)
@start 开启计时器事件(refs方式调用)
@clear 暂停计时器事件(refs方式调用)

隐私、权限声明

1. 本插件需要申请的系统权限列表:

2. 本插件采集的数据、发送的服务器地址、以及数据用途说明:

插件不采集任何数据

3. 本插件是否包含广告,如包含需详细说明广告表达方式、展示频率:

许可协议

MIT协议

使用中有什么不明白的地方,就向插件作者提问吧~ 我要提问