https://github.com/kscript/vcode

vue 插件开发 练手demo
https://github.com/kscript/vcode

Last synced: 11 months ago
JSON representation

vue 插件开发 练手demo

• Host: GitHub
• URL: https://github.com/kscript/vcode
• Owner: kscript
• Created: 2019-03-16T10:19:04.000Z (almost 7 years ago)
• Default Branch: master
• Last Pushed: 2020-07-29T08:56:39.000Z (over 5 years ago)
• Last Synced: 2024-04-25T05:41:02.680Z (almost 2 years ago)
• Language: Vue
• Homepage: https://kscript.gitee.io/vcode/examples/
• Size: 44.9 KB
• Stars: 0
• Watchers: 3
• Forks: 0
• Open Issues: 0
• Metadata Files:
  • Readme: README.md

Awesome Lists containing this project

README

          
# ks-vcode

vue 插件, 验证码输入

### 安装

``` npm

  npm i -D ks-vcode

```

### 使用

main.js

``` js

  import Vue from 'Vue'

  import vcode from 'ks-vcode'

  Vue.use(vcode)

```

app.vue

``` vue

  

export default {

  data () {

    return {}

  },

  methods: {

    vcodeChange(code, index) {

      console.log("vcodeChange", code, index)

    },

    vcodeComplete(code) {

      console.log("vcodeComplete", code)

    }

  }

}

 

```

### 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:已输入的验证码 |