更新记录
1.1.12(2025-03-20)
下载此版本
添加边框类型 type 1 下边框 2 全边框 3 无边框
1.1.1(2025-03-20)
下载此版本
添加边框类型 type 1 下边框 2 全边框 3 无边框, 使用全边框
1.1.0(2025-03-20)
下载此版本
添加输入框类型 inputType 的类型有:1、 number(数字.默认) 2、text(文本输入框 数字、文本等等都可以输入)
查看更多
平台兼容性
App |
快应用 |
微信小程序 |
支付宝小程序 |
百度小程序 |
字节小程序 |
QQ小程序 |
HBuilderX 4.19 app-vue |
× |
√ |
× |
× |
× |
× |
钉钉小程序 |
快手小程序 |
飞书小程序 |
京东小程序 |
鸿蒙元服务 |
× |
× |
× |
× |
× |
H5-Safari |
Android Browser |
微信浏览器(Android) |
QQ浏览器(Android) |
Chrome |
IE |
Edge |
Firefox |
PC-Safari |
√ |
√ |
√ |
√ |
√ |
10 |
√ |
√ |
√ |
xiaopao-code
1、组件直接导入到(uni-modules)即可,
使用:<xiaopao-code></xiaopao-code>
2、添加回调获取验证码方法 cbCode,
使用:<xiaopao-code @cbCode="cbCodeFun"></xiaopao-code>
3、添加是否展示倒计时 showTime 默认为 true,
使用:<xiaopao-code @cbCode="cbCodeFun" :showTime="true"></xiaopao-code>
4、执行开始倒计时直接调用组件的 doStart() 方法, 使用:
<xiaopao-code ref="xiaopaoCodeRef" @cbCode="cbCodeFun" :showTime="true"></xiaopao-code>
this.$refs.xiaopaoCodeRef && this.$refs.xiaopaoCodeRef.doStart() // 在获取验证码结束时,并在组件展示后进行调用
5、执行重新获取验证码方法 getCode(), 使用:
<xiaopao-code ref="xiaopaoCodeRef" @cbCode="cbCodeFun" :showTime="true" @getCode="getCodeFun"></xiaopao-code>
getCodeFun 为调用页面进行获取验证码的方法
6、重置边框样式, 使用:
<xiaopao-code
ref="xiaopaoCodeRef"
borderDefaultColor="#aaaaaa"
borderFocusColor="#86FFF7"
@cbCode="cbCodeFun"
@getCode="getCode">
</xiaopao-code>
注:
(1)、borderDefaultColor 为默认显示的边框色
(2)、borderFocusColor 光标作用展示的颜色
7、20250320添加输入框类型, 使用:
<xiaopao-code
ref="xiaopaoCodeRef"
inputType="text">
</xiaopao-code>
注:inputType 的类型有 number(数字.默认) text(文本输入框 数字、文本等等都可以输入)
8、添加边框类型 type 1 下边框 2 全边框 3 无边框, 使用全边框:
<xiaopao-code
ref="xiaopaoCodeRef"
:type="2">
</xiaopao-code>