更新记录

1.0.0(2024-11-30) 下载此版本

1.提供灵活的倒计时显示,场景获取验证码后倒计时


平台兼容性

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

1.技术栈:

vue3 js

2.使用说明

(1)入参说明
参数名称 参数类型 默认值 是否必填 描述
startText String "获取验证码" 初始返回数据名称(倒计时开始前)
endText String "重新获取" 结束返回数据名称(倒计时完成后)
time Number 60 倒计时时长(单位s)
done Function function 倒计时结束后触发的回调函数
format Function function 格式化返回的文字回调函数(自定义显示)
(2)返回参数说明
参数名称 参数类型 默认值 是否返回 描述
value Any "" 返回的动态响应式数据
start Function function 开始方法(触发动作)

3.示例

// 引入,以文件实际所在目录为准,这里作为示例
import useRnlCountDown from '@/hooks/count-down'
// 初始化
const state: RnlCountDownState = reactive({
        count: 0,
        value: startText,
        start: () => {
            if (isStart) return
            isStart = true
            state.count = newTime
            run()
        },
    })
// 使用数据
// 可以直接放到页面使用,也可放到计算属性二次处理
<button size="small" type="success" @click="start">{{rnlCountDownState.value}}</button>

隐私、权限声明

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

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

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

许可协议

MIT协议

暂无用户评论。

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