vue滑动图片验证登录

最新推荐文章于 2024-08-20 17:03:48 发布

free angels

最新推荐文章于 2024-08-20 17:03:48 发布

阅读量1.4k

点赞数 1

本文链接：https://blog.csdn.net/bss_object/article/details/102480503

版权

本文介绍了如何在Vue项目中实现滑动图片验证功能。通过安装vue-monplasty-slide-verify库，然后引入并使用组件<slide-verify>，设置相关参数如长度、位置和回调函数，可以轻松集成滑动验证到登录过程。

摘要由CSDN通过智能技术生成

预览

在这里插入图片描述
使用步骤：
1.安装 npm install --save vue-monplasty-slide-verify
2.使用方法：
import SlideVerify from “vue-monplasty-slide-verify”
Vue.use（SlideVerify）;
<slide-verify :l=“42”
:r=“10”
:w=“310”
:h=“155”
:slider-text=“text”
@success=“onSuccess”
@fail=“onFail”
@refresh=“onRefresh”

{ {msg}}

export default { name: "App", data(){ return { msg: "", text: "向右滑" } }， methods：{ onSuccess（）{ this.msg="login success" }， onFail（）{ this.msg="" }, onRefresh（）{ this.msg="" } } } 参数说明 props传参（均为可选） ![在这里插入图片描述](https://img-blog.csdnimg.cn/20191010135805817.png?x-