小程序键盘组件
说明
-
当前版本
v1.2.0
-
npm 下载
npm i miniprogram-keyboard-type -S
-
* 为新增功能
-
组件分别为
弹窗式密码键盘
车牌式车牌键盘
* 输入框车牌键盘
-
- 适配
DarkMode
相关链接
- 适配
-
使用说明
"usingComponents": {"Passwordkeyboard": "/您的路径/Passwordkeyboard/index"} -
可修改样式(wxss)
class类 备注 right_key
删除键样式
btn-confirm
弹窗确认键
-
需求参数
参数 说明 类型 是否必传 备注 title
标题
String
是
valueLength
长度
Number
否
默认为6
anonymous
是否密文
Boolean
否
UI显示为 *
isShow
显示
Boolean
是
zIndex
z-index 层级
Number
否
默认为50
safe-area-inset-bottom
ios安全底部
Boolean
否
-
事件
事件 说明 参数 onCancel
取消时触发
- onConfirm
确认时触发
{'value':'123456'}
输入框车牌键盘
-
说明
- 请
CarTypeInput
与CarInputboard
配合使用。 CarTypeInput
可以在from
中使用- 与
carKeyboard
与CarInputboard
的不同- 除样式相同外,删除了一些在使用
TypeInput
不必要的参数和方法 CarInputboard
不包含正则
- 除样式相同外,删除了一些在使用
- 为了更好的体验需要您帮助组件做个一个模拟失去焦点的功能
- 需要一个顶级
view
绑定一个点击事件在页面中 CarInputboard
将它放在顶级view
外
- 需要一个顶级
- 请
-
使用说明
"CarTypeInput": "/component/CarTypeInput/index","CarInputboard":"/component/CarInputboard/index"<!-- 需要您做的模拟失去焦点 --> -
可修改样式(wxss)
-
TypeInput
class类 备注 typeinput
输入框样式
-
-
需求参数
-
TypeInput
参数 说明 类型 是否必传 备注 value
值
String
是 height
input高
Number
否 默认60px
placeholder
输入框为空时占位符
String 否 isBlur
是否失去聚焦
Boolean 是 lineColor
光标颜色
16进制 否 默认#333
name
key值
String 否 from
内使用必传height
影响光标高度name
在from
内使用必传isBlur
true为失去焦点
-
CarInputboard
参数 说明 类型 是否必传 备注 isShow
是否显示键盘 String 是 必传 isBlur
是否失去聚焦 Number 是 必传 safeAreaInsetBottom
ios安全底部
String 否 isBlur
true为失去焦点
-
-
事件
-
TypeInput
事件 说明 参数 onfocus
获取焦点时
- -
CarInputboard
事件 说明 参数 ListenValue
监听值变化
’value‘:值,‘sub‘:长度,exp:正则信息
onConfirm
点击完成时触发
-
-
车牌式车牌键盘
-
说明
- 请
carKeyboard
与carKeyInput
配合使用 - 注意事项
- 在需需要您使用
CarCardInput
的onChangeCard
获取的CarNumid
传递给CarCardboard
组件
- 在需需要您使用
- 请
-
参考资料
-
使用说明
"CarCardInput": "/您的路径/CarCardInput/index""CarCardboard": "/您的路径/carKeyInput/index"<CarCardInputvalue="{{value}}"bind:onChangeCard="onChangeCard"bind:onClickBox="onClickBox"/><CarCardboardbind:ListenValue="getValue"bind:onConfirm="onClickBox"CarNumid="{{CarNumid}}"isShow="{{show}}"/> -
需求参数
-
CarCardInput
参数 说明 类型 是否必传 备注 value
渲染值
Array
是
showCard
是否显示切换卡
Boolean
否
-
CarCardboard
参数 说明 类型 是否必传 备注 CarNumid
车牌类型下标
Number
是
safe-area-inset-bottom
ios安全底部
Boolean
否
-
-
事件
-
carKeyInput
事件 说明 参数 ChangeCard
当车牌类型卡片改变时
CarNumid
onClickBox
点击时触发
- -
carKeyInput
事件 说明 参数 ListenValue
监听值变化
’value‘:值,‘sub‘:长度,exp:正则信息
onConfirm
点击完成时触发
-
-
乱序英文键盘(移除)
项目中留存,npm包中不包含英文乱序键盘
体验&作者微信
npm版本更新
-
v1.2.0
- 新增功能
CarCardInput
新增是否显示切换卡- 适配 DarkMode
- 更新名称
TypeInput(叫TypeInput可能打包不进去?)
->CarTypeInput
- 新增功能
-
v1.1.2
- 更新说明文档
-
v1.1.0
-
更新名称
CarCardboard->carKeyboard
CarCardInput->carKeyInput
-
新增组件
TypeInput
和CarInputboard
-
修复
- 修复了
CarCardboard
组件在页面进入如时闪的问题
- 修复了
-
其他
-
删除了一些不该有的打印日志和不必要参数
-