1.5.2 • Published 11 months ago

input-plate-number v1.5.2

Weekly downloads
22
License
MIT
Repository
github
Last release
11 months ago

Use input-plate-number

因为是使用的 touch 事件,所以目前自定义车牌键盘只支持移动端使用

PC 端则采用 input 输入框的形式用于处理用户输入车牌

安装

yarn add input-plate-number  / npm install input-plate-number / pnpm install input-plate-number

使用

因为是基于 Vue2.x 开发的组件库,所以只支持在 Vue2.x 项目中使用

// main.js
import InputPlateNumber from 'input-plate-number'
import 'input-plate-number/lib/input-plate-number.css'

Vue.use(InputPlateNumber)
<!-- template -->
<input-plate-number></input-plate-number>

API

slot

参数说明
default组件中 body 中自定义内容
header组件头部进行自定义内容

props 传入参数

参数说明类型默认值
wrapClass最外层的 classNameString-
defaultPlateNumber初始化时展示的车牌String浙B
keyboardVisible是否显示自定义键盘Booleantrue
energy是否打开新能源开关Booleanfalse
isNoCar是否打开无牌车适配Booleanfalse

Events

事件名说明回调函数
done输入完成后触发 (移动端输入完成后则自动触发, PC 端需要按下回车键触发){ isPlateNum: Boolean,plateNum: String }
key-click输入时触发 (移动端触摸自定义车牌键盘触发, PC 端输入框输入时自动触发){ curKey: String, plateNum: String }
del-click删除时触发 (移动端触摸自定义删除键触发,PC 端按下 Backspace 回退键时触发){ plateNum: String }
inp-click移动端触摸上方输入框的时候触发{ curIdx: Number, plateNum: String }
change-energy开关新能源模块滑块时触发boolean
close移动端关闭自定义键盘时触发-

注意事项

  • 如果要更改默认车牌应在 created 生命周期中进行处理,否则需要利用组件 key 特性进行重新渲染才会生效 (1.4.1之后版本已解决)
  • 目前暂不支持 v-model 使用
1.5.2

11 months ago

1.5.1

3 years ago

1.4.2

3 years ago

1.5.0

3 years ago

1.4.1

4 years ago

1.4.0

4 years ago

1.3.1

4 years ago

1.3.0

4 years ago

1.2.3

4 years ago

1.2.2

4 years ago

1.2.1

4 years ago

1.2.0

4 years ago

1.1.2

5 years ago

1.1.1

5 years ago

1.1.0

5 years ago

1.0.9

5 years ago

1.0.8

5 years ago

1.0.7

5 years ago

1.0.6

5 years ago

1.0.5

5 years ago

1.0.4

5 years ago

1.0.2

5 years ago

1.0.1

5 years ago

1.0.0

5 years ago

1.0.3

5 years ago

0.0.8

5 years ago

0.0.4

5 years ago

0.0.3

5 years ago

0.0.1

5 years ago

0.0.2

5 years ago

0.1.0

5 years ago