主题
LicensePlate 车牌号键盘
提供省份、字母和数字按键，车牌内容由页面自行维护。
支持平台
以下为官网文档所列的平台支持情况，具体功能及版本限制请参见本页的平台说明。
| App-vue | App-nvue | 微信小程序 | 支付宝小程序 | 百度小程序 | 字节小程序 | QQ小程序 | H5 | PC | 快手小程序 | 钉钉小程序 |
|---|---|---|---|---|---|---|---|---|---|---|
| ✓ | ✓ | ✓ | ✓ | ✓ | ✓ | ✓ | ✓ | ✓ | ✓ | ✓ |
基础用法
vue
<!-- 车牌键盘 -->
<fui-license-plate :show="showKeyboard" toolbar @click="handleKey"
@backspace="handleBackspace" @complete="showKeyboard = false" />页面需定义显示状态及按键、退格处理方法。
属性
| 属性 | 类型 | 说明 | 官网默认值 |
|---|---|---|---|
| show | Boolean | 是否显示 | false |
| toolbar | Boolean | 是否显示完成工具栏 | false |
| text | String | 完成按钮文字 | 完成 |
| color | String | 完成按钮颜色 | #465CFF |
| size | Number / String | 完成按钮字号，单位 rpx | 30 |
| fontWeight | Number / String | 完成按钮字重 | 500 |
| name | String | 退格图标名称 | backspace-fill |
| theme | String | 主题：light、dark | light |
| zIndex | Number / String | 层级，nvue 不支持 | 1001 |
| safeArea | Boolean | 是否适配底部安全区 | true |
事件
| 事件 | 说明 | 回调参数 |
|---|---|---|
| click | 点击车牌按键 | { value } |
| backspace | 点击退格键 | {} |
| complete | 点击完成按钮 | {} |
实例的 changeKeyboard(type) 可切换 cn、en 键盘。非 nvue 默认主色可通过 --fui-color-primary 调整。
插槽
| 插槽 | 说明 |
|---|---|
| default | 键盘上方的自定义内容 |