v-slide-verify

Quick Start

Using build tools:

npm install --save v-slider-verify

import Vue from 'vue';
import vSliderVerify from 'v-slider-verify';

Vue.use(vSliderVerify);

2. Now you have it. The simplest usage:

<v-slider-verify :l="42"
            :r="10"
            :w="310"
            :h="155"
            @success="onSuccess"
            @fail="onFail"
            @refresh="onRefresh"
             @changeNum = "change"
            :sliderText="'请向右滑动'"
            :setNum = "10"
            ></v-slider-verify>
<div>{{msg}}</div>

export default {
        name: 'App',
        data(){
            return {
                msg: '',
            }
        },
        methods: {
            onSuccess(){
                this.msg = 'login success'
            },
            onFail(){
                this.msg = ''
            },
            onRefresh(){
                this.msg = ''
            }
        }
    }

Document

argument

| Param | Type | Describe | | :------: | :------: | :------: | | l | Number | block length | | r | Number | block circle radius | | w | Number | canvas width | | h | Number | canvas height | | sliderText | string | Slide filled right | | setNum | Number | default(20) |

callBack

| Event | Type | Describe | | :------: | :------: | :------: | | success | Function | success callback | | fail | Function | fail callback | | refresh | Function | refresh button callback | | changeNum | Function | success num |

Log

V0.1.12