場景：收費處醫生，為了提高效率，快速開單，經常會習慣性的多點保存/確認按鈕；往往會發生多次請求，造成打印單據重復，結算金額對不上；故提出防止重復提交的控制；
解決方案：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 = setTimeout(() => { // 進入該分支說明當前並沒有在計時，那么就開始一個計時
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 = false;
//事件
//定時器
setTimeout(function() {
isClick = true;
}, 3000);//3秒內不能重復點擊
//執行代碼塊
}else{
message.warning("請勿重復點擊！")
}
}
效果：
