好资源导航 » 文章资讯 » 关于vue表单提交防双/多击的例子

关于vue表单提交防双/多击的例子

2023-08-10 03:22:03 72

先说下出现场景：

测试这次比较极端(也有可能是测试又学会什么新知识了，哈哈)，说是在点击提交和调用之间有可能有狂暴的用户在多连击，就像打游戏一样，调用接口后的loading状态切换就无效了

然后，就只好自己写了个基于vue防多击的指令,小小偷懒了下，我里面已经注入fastClick了，因此响应方法是极快的，因此只需要稍微控制下二次点击的时间即可

exportdefault{}.install=(Vue,options={})=>{
Vue.directive('dbClick',{
inserted(el,binding){
el.addEventListener('click',e=>{
if(!el.disabled){
el.disabled=true;
lettimer=setTimeout(()=>{
el.disabled=false;
},1000)
}
})
}
})
}

用法：

保存

以上这篇关于vue表单提交防双/多击的例子就是小编分享给大家的全部内容了，希望能给大家一个参考，也希望大家多多支持毛票票。

声明：本文内容来源于网络，版权归原作者所有，内容由互联网用户自发贡献自行上传，本网站不拥有所有权，未作人工编辑处理，也不承担相关法律责任。如果您发现有涉嫌版权的内容，欢迎发送邮件至：czq8825#qq.com（发邮件时，请将#更换为@）进行举报，并提供相关证据，一经查实，本站将立刻删除涉嫌侵权内容。

返回顶部
514930285
czq8825@qq.com

关于vue表单提交防双/多击的例子

热门推荐

随机推荐