Js的debounce 方法使用

應用場景

由於事件頻繁被觸發,因而頻繁執行DOM操作、資源加載等重行爲,導致UI停頓甚至瀏覽器崩潰。

簡單用法

/**
2 * 空閒控制 返回函數連續調用時,空閒時間必須大於或等於 idle,action 纔會執行
3 * @param fn   {Function}    相關執行函數
4 * @param delay {Number}  延遲時間,也就是閾值,單位是毫秒
5 * @return {function}    返回一個“去彈跳”了的函數
6 */
7 debounce(fn,delay)

例子

let validateNameRepeat = async (rule, value, callback) => {
      try {
        let res = await valiSchoolName({
        option:this.params.option,
        name: this.form.name,
        id: this.params.id})
        if (res.code === 200){
          if(res.result === "true"){
             callback() 
          }
          if(res.result === "false"){
             callback(new Error('當前學校名稱已經存在,請修改'));  
          }
        } else {
          callback(new Error('服務器不能驗證學校名稱'));  
        }      
      } catch (error) {
          callback(new Error('驗證學校名稱異常'));           
      }
};
validateNameRepeat = debounce(validateNameRepeat,300,this)

 

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章