vue-滑块验证

效果图:

vue-滑块验证_第1张图片

 

  • 下载依赖:
"vue-monoplasty-slide-verify": "^1.1.3",
  •  引入滑块组件

使用到的有如下属性:宽度、高度、误差、提示文字、img背景。
查看源码可以看到还支持更多的属性,但个人认为,在日常开发中,这几个属性够用了,有需要的可自行了解更多属性。

vue-滑块验证_第2张图片 

使用到的方法:again(重试)、fulfilled(刷新)、suceess(校验成功)、fail(校验失败)、refresh(手动触发刷新小图标)

其中该组件还提供了重置操作:

vue-滑块验证_第3张图片

个人组件源码:

verify.vue 文件





引入该组件:

 

你可能感兴趣的:(前端-vue-组件,验证滑块,vue)