防重复提交（节流）JS通用版

常见场景

在涉及到提交的功能如果网络较慢，且用户反馈是在接口求情完成触发用户可能多次点击按钮，提交重复切无意义的请求。

思路

当持续触发事件时，保证一定时间段内只调用一次事件处理函数。关键点就是设置事件的间隔触发时间，测试提出这个问题后迅速写了一版本。

var timer=true;//全局变量
fn(){
   if(timer){
      demo() //要执行的方法
      timer=false;//禁止重复执行
   }
   setTimeout(()=>{
       timer=true;//1.5秒后可以再次执行
   },15000);
}

后面感觉这个方法会经常用，就封装了下。第二版(以下为Vue代码jquery或原生需把this.cnaRun改为全局变量)：

/**
   * 节流
   * @param fn 需要节流的方法 ---不可为空
   * @param val 节流方法中的参数 ---可为空
   * @param time 间隔时长 ---可为空
   */
  cnaRun: true,
  debounce(fn,val,time) {
    if (!this.cnaRun) return
    this.canRun = false;
    val?fn(val):fn();//三元表达式设置有参无参方法
    setTumeout(()=>{
      this.canRun = true;
    },time||1500);//间隔时长设置默认值
  }
  
  function helloWord(val){
      console.log(val)
  }
  //调用
  debounce(helloWord,1,1000)