car-plate-keyboard

介绍

• car-plate-keyboard 是基于 Vue 的一款虚拟键盘，用于车牌号输入。

示例

• GitHub
• GitEE

如何使用

• 安装

npm install car-plate-keyboard --save

• vue 中注册插件

import carPlateKeyboard from 'car-plate-keyboard'
import 'car-plate-keyboard/lib/carPlateKeyboard.css'

Vue.use(carPlateKeyboard)

• 页面使用

<car-plate-keyboard @submit="submit"></car-plate-keyboard>

API

Props

| 参数 | 说明 | 类型 | 默认值 | | ---------------------- | ------------------------------------ | ------- | ------ | | value | 默认值 | String | "" | | open-keyboard-on-init | 初始化时就弹出键盘（在弹窗中使用时） | Boolean | false | | close-on-click-overlay | 点击遮罩关闭键盘 | Boolean | true | | overlay | 是否使用遮罩 | Boolean | true | | preview-on-keyboard | 是否在键盘上预览输入的值 | Boolean | true | | check-input-blocked | 检查键盘是否挡住输入框 | Boolean | false | | readonly (1.0.2) | 是否只读 | Boolean | false |

Events

| 参数 | 说明 | 参数 | | ------ | ---- | ---------------------------- | | cancel | 取消 | value: string (当前输入的值) | | submit | 确定 | value: string (当前输入的值) |

Slots

| 参数 | 说明 | slotProps | | --------- | ------------------------ | ----------- | | default | 自定义输入框 | value:Array | | backspace | 自定义退格(删除)按钮内容 | - |

声明

• 本项目基于此项目上 input-number-plate 进行二次开发

• 在此感谢 原作者 对开源做出的贡献

Change Log

1.0.4

• 修复 遮罩覆盖键盘问题

1.0.3

• 修复 ios 上打开键盘时，定位错误问题

1.0.2

• 增加 只读 readonly api

1.0.1

• none

1.0.0

• 首个版本