【js】按钮频繁过快点击，防⽌重复提交处理
场景：收费处医⽣，为了提⾼效率，快速开单，经常会习惯性的多点保存/确认按钮；往往会发⽣多次请求，造成打印单据重复，结算⾦额对不上；故提出防⽌重复提交的控制；
解决⽅案：1.增加⼆次确认操作，弹框式确认；⽆疑会增加操作步骤，更⿇烦了。2.防抖函数，控制在⼏秒内的点击只提交⼀次请求，记录最后⼀次点击开始计时请求；（待定）3.变量开关控制，保证⼏秒之内只提交⼀次，代码块⽴即
执⾏（可取）
实现：2.防抖函数
封装⽅法例如：tools/index下Util对象中
/*
* fn [function] 需要防抖的函数
* interval [number] 毫秒，防抖期限值
* 在第⼀次触发事件时，不⽴即执⾏函数，⽽是给出⼀个期限值⽐如300ms
* 让某个时间期限（300毫秒）内，事件处理函数只执⾏⼀次。立体五角星的折法
*/
debounce(fn, interval) {
var timeout = null;//借助闭包
万圣节游戏return function (e) {
clearTimeout(timeout);//进⼊该分⽀语句，说明当前正在⼀个计时过程中，并且⼜触发了相同事件。所以要取消当前的计时，重新开始计时
今世有缘歌词timeout = tTimeout(() => { // 进⼊该分⽀说明当前并没有在计时，那么就开始⼀个计时
fn.apply(this, arguments);
}, interval ? interval : 300);
};
},
优美的英文诗引⼊⽅法
import { Util } from 'tools/index';
a.
handleQuery = Util.debounce((name, status, quarters) => {
console.log("---",name, status, quarters)
//代码块可接收参数
品字形结构的字},2000)
b. 按钮事件 handleBtn
handleBtn=()=>{
let {status, name, quarters} = this.state;
this.handleQuery(name, status, quarters);
}
太平乐
缺点：防抖函数每次会在设定时间内记录最后⼀次点击，然后开始计时，会增加业务场景中的等待时间；
3.js控制变量
全局设置⼀个变量或者state变量储存
// 按钮事件
handleBtn = () => {月报怎么写
if(isClick) {
isClick = fal;关于华罗庚的故事
//事件
//定时器
tTimeout(function() {
isClick = true;
}, 3000);//3秒内不能重复点击
//执⾏代码块
}el{
message.warning("请勿重复点击！") }
}
效果：
