mand-mobile/components/number-keyboard
MeloHG 39216555ba feat: 键盘增加0,00键可替换 2023-10-11 15:59:31 +08:00
..
demo feat: 键盘增加0,00键可替换 2023-10-11 15:59:31 +08:00
test feat(chore): ui,color upgrade (#755) 2021-08-06 14:34:26 +08:00
README.en-US.md feat: 键盘增加0,00键可替换 2023-10-11 15:59:31 +08:00
README.md feat: 键盘增加0,00键可替换 2023-10-11 15:59:31 +08:00
board.vue feat: 键盘增加0,00键可替换 2023-10-11 15:59:31 +08:00
component.js Initial commit 2018-03-26 16:04:04 +08:00
index.vue feat(numberKeyboard): 支持 00 按键 2022-08-24 16:41:00 +08:00
key.vue fix(number-keyboard): avoid repeated triggering of click and touchstart (#684) 2020-07-24 14:47:21 +08:00

README.en-US.md

title preview
NumberKeyboard https://didi.github.io/mand-mobile/examples/#/number-keyboard

Generally used for financial scenarios such as password, verification code or payment amount input

Import

import { NumberKeyboard } from 'mand-mobile'

Vue.component(NumberKeyboard.name, NumberKeyboard)

Code Examples

API

NumberKeyboard Props

Props Description Type Default Note
v-model display keyboard or not Boolean false -
is-view inline display in page, otherwise it shows as Popup Boolean false -
type keyboard type String professional professional with confirmation key and decimal point is often used for price or amount input, simple is generally used for password or verification code input
disorder if numeric keys of keyboard are out of order Boolean false -
is-hide-confirm automatically hide the keyboard when confirming Boolean true -
text-render customize value of specified key Function(value: string): string - replaceable key 0,1,...9,.,0,002.6.2+
ok-text text of confirmation key String confirm -
disabled 2.6.0+ to disable the keyboard Boolean false -
duplicate-zero 2.6.0+ show 00 key Boolean false This props is valid only when type is professional

NumberKeyboard Slots

default

<md-number-keyboard>
  <md-icon name="security"></md-icon>&nbsp;安全支付
</md-number-keyboard>

NumberKeyboard Methods

show()

Display keyboard

hide()

Hide keyboard

NumberKeyboard Events

@enter(val)

Click numeric key

Props Description Type
val value Number
@delete()

Click delete key

@confirm()

Click confirmation key