1.0.1 • Published 4 years ago

kr-slide-verify v1.0.1

Weekly downloads
6
License
-
Repository
-
Last release
4 years ago

kr-slide-verify

简介

一个基于Vue的滑块验证组件,该组件可配后后端代码实现滑块验证功能!

安装与使用

npm安装组件

npm install kr-slide-verity

引入

import Vue from 'vue'
import KrSlideVerify from "kr-slide-verify"

Vue.use(KrSlideVerify)

使用

  <kr-slide-verify
    :w="slideInfo.w"
    :h="slideInfo.h"
    :block_w="slideInfo.block_w"
    :block_h="slideInfo.block_h"
    :img="slideInfo.img"
    :block_img="slideInfo.miniimg"
    :loading="loading"
    @refresh="refresh"
    @verify="valid"
  ></kr-slide-verify>

Attributes

参数说明类型可选值默认值
w画布宽度Number——320
h画布高度Number——160
block_w滑块宽度Number——50
block_h滑块高度Number——160
img画布背景图地址String————
block_img滑块图片地址String————
sliderText操作提示文字String——'向右拖动滑块填充拼图'
loading加载标识Stringtrue/falsefalse

Events

事件名称说明回调参数
refresh刷新滑块验证时触发(callback:Function)
verify验证滑块位置时触发(left:Number,callback:Function) left:滑块向右的滑动量
1.0.1

4 years ago

1.0.0

4 years ago