# vue-verify-keyboard

> a Virtual numeric keypboard for Verification code or Password

Latest version **1.0.4** (published 2020-06-12) · MIT license · 0 weekly downloads

## Install

```sh
npm install vue-verify-keyboard
pnpm add vue-verify-keyboard
yarn add vue-verify-keyboard
bun add vue-verify-keyboard
```

## Health

**Score 15/100 (F)** — status: abandoned.

Positive: no vulnerabilities.

Warnings: low downloads; no types; no esm support.

Negative: abandoned; low maintenance score.

## Facts

| | |
|---|---|
| Version | 1.0.4 |
| Published | 2020-06-12 |
| First published | 2020-06-12 |
| Weekly downloads | 0 |
| License | MIT |
| TypeScript types | none |
| Module format | CommonJS |
| Dependencies | 1 |
| Unpacked size | 160.9 KB |
| Known vulnerabilities | 0 (+1 in 1 direct dependencies) |
| Install scripts | no |
| Author | taoyouyou |
| Maintainers | taoyouyou |
| Keywords | vue, keyboard, verify, pay, password |

## Links

- npm: https://www.npmjs.com/package/vue-verify-keyboard
- Repository: https://github.com/skique/vue-keyboard
- Homepage: https://github.com/skique/vue-keyboard#readme
- Issues: https://github.com/skique/vue-keyboard/issues
- npm.io page: https://npm.io/package/vue-verify-keyboard

## Dependencies (1)

- [vue](https://npm.io/package/vue.md) ^2.5.11

## Recent versions

- 1.0.4 (latest) — 2020-06-12
- 1.0.3 — 2020-06-12
- 1.0.2 — 2020-06-12
- 1.0.1 — 2020-06-12
- 1.0.0 — 2020-06-12

## README

# vue-verify-keyboard

> 一个适用于验证码以及密码校验的虚拟数字键盘

> a Virtual numeric keypboard for Verification code or Password

![使用方法](https://gitee.com/taoyouyou/vue-keyboard/raw/master/gif5.gif)



## 引入组件并注册

```
import vueKeyboard from 'vue-verify-keyboard'

Vue.use(vueKeyboard)
```

## 使用方法




for Verification:
``` bash

<vue-verify-keyboard :number="codeNum" :time="30" :verifyBtn='verifyBtn' :loading="loading" :phone="phone" @submit="submit" @send="sendCode"  @close="close" @on-time-change="onTimeChange" v-if="showKeyboard"></vue-verify-keyboard>

```
for Password:
``` bash

<vue-verify-keyboard v-if="showPassword" type="password" :number="6" placeholder=' ' desc="您正在更改重要信息，输入密码支付进行安全验证" @submit="checkPayPwd" @close="showPassword = false"  @forget="forgetPassword"></vue-verify-keyboard>

```



### 属性
- type: String 控件类型(verify || password),默认为verify
- number: Array 验证码长度
- placeholder: String 占位符

- verifyBtn: Object 支持自动定义验证码按钮文字，描述，以及按钮状态 (仅用于验证码组件)
- loading: Boolean 控制验证码状态 (仅用于验证码组件)
- phone: Number 自定义传入需要发送验证码的手机号  (仅用于验证码组件)
- time: Number 自定义倒计时的秒数 (仅用于验证码组件)

- desc: 描述  (仅用于密码组件)

### 方法
- submit 完成输入验证码之后自动触发该方法，验证码作为传入的参数
- sendCode 发送验证码
- close 关闭组件
- forget 忘记密码 (仅用于密码组件)

---
_Source: https://npm.io/package/vue-verify-keyboard · Machine-readable twin of the npm.io package page. Health data is recomputed on every publish._