更新记录
1.0.1(2020-11-05)
更新日期
2020-11-05
解决问题
- 车牌号键盘前缀输入后自动切换为字母数字键盘
- 密码输入框添加明文展示方法
- 更新依赖包uni-popup
待解决
- 统一两个组件一起使用的场景,暂时没考虑好布局问题
建议
可在评论中提出意见或在码云共同开发。
1.0.0(2019-10-22)
uni-app 自定义键盘UI组件
自定义键盘
参数
type: {//number数字键盘,idCard身份证键盘,plateNumber车牌号键盘
type: String,
default: 'number'
},
safeAreaInsetBottom: { //是否设置安全区(iPhone10以上)
type: Boolean,
default: false
},
disableDot: { //数字键盘是否禁止点击.仅type为number生效
type: Boolean,
default: false
}
预览
![](https://images.gitee.com/uploads/images/2019/1022/165821_7551c460_4867518.png)
![](https://images.gitee.com/uploads/images/2019/1022/165903_18840524_4867518.png)
![](https://images.gitee.com/uploads/images/2019/1022/165952_1f7f1292_4867518.png)
![](https://images.gitee.com/uploads/images/2019/1022/170017_0b5d2f1f_4867518.png)
事件
open 打开键盘
close 关闭键盘
onConfirm 当用户点击确认
onDelete 当用户点击删除
onInput 当用户输入,携带一个参数——当前值
自定义密码输入框
length:{//长度只允许为6和4
type:Number,
default:6,
validator(val){
if(val!==6 && val !==4){
return false;
}
return true;
}
},
gutter:{//输入框间隔,单位:rpx
type:Number,
default:0
},
list:{//密码数组
type:Array,
default:function(){
return [];
}
}
事件
空
注意事项
本组件基于uni-app开发
本组件依赖uni-popup组件
赞赏
如果本组件能够有幸帮到你,如果你刚好有闲钱,如果你心情刚刚好,请留下你的赞赏,谢谢。
![](https://images.gitee.com/uploads/images/2019/1022/173250_4032d97f_4867518.jpeg)
平台兼容性
HbuilderX/cli最低兼容版本 |
2.9.7 |
uni-app
app-vue |
app-nvue |
app-android |
app-ios |
? |
? |
? |
? |
H5-Safari |
Android Browser |
微信浏览器(Android) |
QQ浏览器(Android) |
Chrome |
IE |
Edge |
Firefox |
PC-Safari |
? |
? |
? |
? |
? |
? |
? |
? |
? |
微信小程序 |
支付宝小程序 |
百度小程序 |
字节小程序 |
QQ小程序 |
钉钉小程序 |
快手小程序 |
飞书小程序 |
京东小程序 |
? |
? |
? |
? |
? |
? |
? |
? |
? |
uni-app x
H5-Safari |
Android Browser |
微信浏览器(Android) |
QQ浏览器(Android) |
Chrome |
IE |
Edge |
Firefox |
PC-Safari |
? |
? |
? |
? |
? |
? |
? |
? |
? |
uni-app 自定义键盘UI组件
自定义键盘
参数
type: {//number数字键盘,idCard身份证键盘,plateNumber车牌号键盘
type: String,
default: 'number'
},
safeAreaInsetBottom: { //是否设置安全区(iPhone10以上)
type: Boolean,
default: false
},
disableDot: { //数字键盘是否禁止点击.仅type为number生效
type: Boolean,
default: false
}
预览
![](https://images.gitee.com/uploads/images/2019/1022/165821_7551c460_4867518.png)
![](https://images.gitee.com/uploads/images/2019/1022/165903_18840524_4867518.png)
![](https://images.gitee.com/uploads/images/2019/1022/165952_1f7f1292_4867518.png)
![](https://images.gitee.com/uploads/images/2019/1022/170017_0b5d2f1f_4867518.png)
事件
open 打开键盘
close 关闭键盘
onConfirm 当用户点击确认
onDelete 当用户点击删除
onInput 当用户输入,携带一个参数——当前值
自定义密码输入框
length:{//长度只允许为6和4
type:Number,
default:6,
validator(val){
if(val!==6 && val !==4){
return false;
}
return true;
}
},
gutter:{//输入框间隔,单位:rpx
type:Number,
default:0
},
list:{//密码数组
type:Array,
default:function(){
return [];
}
}
事件
空
注意事项
本组件基于uni-app开发
本组件依赖uni-popup组件
赞赏
如果本组件能够有幸帮到你,如果你刚好有闲钱,如果你心情刚刚好,请留下你的赞赏,谢谢。
![](https://images.gitee.com/uploads/images/2019/1022/173250_4032d97f_4867518.jpeg)