0.2.0 • Published 5 years ago
ks-vcode v0.2.0
ks-vcode
vue 插件, 验证码输入
安装
  npm i -D ks-vcode使用
main.js
  import Vue from 'Vue'
  import vcode from 'ks-vcode'
  Vue.use(vcode)app.vue
<template>
  <v-code mode="both" :len="4" @change="vcodeChange" @complete="vcodeComplete"></v-code>
</template>
<script>
export default {
  data () {
    return {}
  },
  methods: {
    vcodeChange(code, index) {
      console.log("vcodeChange", code, index)
    },
    vcodeComplete(code) {
      console.log("vcodeComplete", code)
    }
  }
}
</script> Props
| prop | 类型 | 取值 | 说明 | 
|---|---|---|---|
| len | number | - | 验证码长度 | 
| groupClass | string | - | 验证码父容器class | 
| mode | string | number,letter,mix,all | 输入模式,支持 数字/字母/混合/所有字符 | 
Events
| 事件 | 参数 | 说明 | 
|---|---|---|
| change | (code: string[], index: number) | 输入内容改变时触发. code:已输入的验证码, index:当前输入的验证码在code中的索引 | 
| complete | (code: string[]) | 输入完成时触发. code:已输入的验证码 |