monoplasty / vue-monoplasty-slide-verify Goto Github PK
View Code? Open in Web Editor NEWvue slide verify online preview
Home Page: https://monoplasty.github.io/vue-monoplasty-slide-verify/
vue slide verify online preview
Home Page: https://monoplasty.github.io/vue-monoplasty-slide-verify/
经常会出现获取不到图片的问题
多次快速点击refresh,图片会不显示
本地图片和网络url都必须使用import引入吗?为什么我按照app.vue里面的写法各种报错啊
是不是用不了插件啊?不能npm install,也没有main.js,没有use,就是个abc.html,写好给后端
h5 在苹果手机上 滑动滑块,背景图会颤抖...
建议提供下ts的声明文件的,及开放源码
import SlideVerify from 'vue-monoplasty-slide-verify';
export default {
components: {
SlideVerify,
},
}
运行会提示
Failed to mount component: template or render function not defined.
想使用本地的图片作为滑动验证图片,在父组件中created生命周期设置this.$refs.slideblock.imgs = 图片的项目路径数组,发现没有生效,验证图片路径,发现路径没有错。请问作者,是我属性设置方式不正确?还是什么其他的原因造成??
模板:
<template> <slide-verify :l="42" :r="10" :w="310" :h="155" ref = "slideblock" slider-text="向右滑动" @mousedown.native="getMouseDownTime()" @mousemove.native="getMouseMoveTrail($event)" @mouseup.native="getMouseUpTime()" @success="onSuccess" @fail="onFail" @refresh="onRefresh" /> </template>
代码:
`import { slideVerifyLogic } from '@/api/slideVerify'
export default {
name: 'SlideVerifyTool',
data() {
return {
query: {
mouseDownTime: null,
mouseDragTime: null,
locationCount: 0,
locationSum: 0,
verifySuccess: false
},
}
},
created() {
this.$refs.slideblock.imgs = ['@/assets/slide-verify-img/1.jpg', '@/assets/slide-verify-img/2.jpg', '@/assets/slide-verify-img/3.jpg']
},
...`
图片上的白色拼图显示不出
比如我的图片验证码与登录配合使用时,调用后台接口失败后,不点击刷新按钮,不能重新加载刷新验证码
建议内置10几张图片随机出现就不会了
按照教程操作,未找到注册组件
目前看到通过验证需要的距离是随机的,在文档也没看到哪个参数可以设置距离。我想在后端也做一个验证,所以想用后端发来的距离设置为通过验证所需要的距离。
微信8.024
拖动滑块时发现明显卡顿
经过测试发现,当微信内文字大小变化时,会出现明显卡顿;反之就可以正常运行;
迫于研究了很久没有发现结果,想请问下作者,这两者是如何相互作用的?
console.log('验证通过,耗时 '+ times + '毫秒');
手机谷歌浏览器没问题。目前小米浏览器,360浏览器等等,滑块无法滑动。只能向前滑动一丢丢
chrome iphone 6/7/8
bug:
图片加载中的遮罩层没显示
图片未加载完成,也可以验证
请问我能否在MIT license 下使用你的代码?因为我没有看到相关的LICENSE文件声明,只看到package.json中有个
{
"license": "MIT",
}
图片加载比较慢,是否可以更换国内图床
I want to show the verify image when hovering the drag button.
And the image is hidden by default.
How to custom this behaviour, really hope ur help.
就是不只是拖动下面的进度条可以,直接拖动上面的拼图块也可以。是否可行
您的前台效果做的非常棒,但是有个问题,目前只有前台效果,并没有在后台获取到什么内容,比如之前图形验证码,需要再后台获取图片,如果不在后台验证的话,机器很容绕过前台,直接请求接口,这样验证码就形同虚设了
能不能把代码挪到gitee上
拼图模式下,滑动出现卡顿现象。
vue移动端划不动啊
设置画布宽度( w )后下方的滑块区域不会跟随改变长度 造成画布和下方的拖动区长度不一致
您好,图片需要加载很久才出来,是服务器出了什么问题吗?
组件已经注册,但是也没找不到dom节点
这个可以 初始化的时候 先不加载图片,开始滑动的时候在展示图片可以吗
请问能说明一下verify()的原理吗?
这种以它的偏移量求平均数的目的是什么?求指教
A declarative, efficient, and flexible JavaScript library for building user interfaces.
🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
An Open Source Machine Learning Framework for Everyone
The Web framework for perfectionists with deadlines.
A PHP framework for web artisans
Bring data to life with SVG, Canvas and HTML. 📊📈🎉
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
Some thing interesting about web. New door for the world.
A server is a program made to process requests and deliver data to clients.
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
Some thing interesting about visualization, use data art
Some thing interesting about game, make everyone happy.
We are working to build community through open source technology. NB: members must have two-factor auth.
Open source projects and samples from Microsoft.
Google ❤️ Open Source for everyone.
Alibaba Open Source for everyone
Data-Driven Documents codes.
China tencent open source team.