有一些方法可以处理重复的按钮点击请求。以前常见的做法是记录点击后的状态，然后锁定按钮。第一步是点击按钮，设置一个锁为真，并禁用按钮绑定的按钮。请求执行后，无论成功还是失败都会被重置。如果为false，则释放按钮并再次单击OKjsfunc(){this.requestLock=truesendMessage(query).then((response)=>{this.delayedRequest()}).catch(error=>{this.delayedRequest()})}delayedRequest(){setTimeout(()=>{this.requestLock=!this.requestLock},500)}这个方法可以用来防止重复点击请求，我们不可能每个页面都加上这个方法。重复和代码太多，于是想到了使用指令全局引入指令。所有的地方都可以愉快的使用给指令项目添加一个JS文件importVuefrom'vue'constpreventDbClick=Vue.directive('preventDbClick',{inserted:function(el,binding){el.addEventListener('click',()=>{if(!el.disabled){el.disabled=truesetTimeout(()=>{el.disabled=false},1000)}})}});export{preventDbClick}在main.js中引入commandimport'./directive/preventDbClick.js'页面中的按钮即可~确定
