vue3防抖节流封装与使用

1.使用方法为一：main中import引入并且挂载:app.config.globalProperties.debounce =debounce,节流也是如此，这样就不需要每个页面都要引入然后在使用了

2.使用方法const fn =debounce(()=>{

},防抖时间为：500)

3.const fn2 =debounce(fn,500)如果采用ts则：.const fn2:function =debounce(fn,500)，fn2为你点击按钮调用的事件，而fn则是你需要防抖的方法

4.防抖节流使用都是一样的

/**

 * @param debounce 防抖方法

 */

export function debounce(fn, delay = 200) {

  let timer = null;

  return function () {

    if (timer) {

      clearTimeout(timer);

    }

    timer = setTimeout(() => {

      fn.apply(fn, arguments);

      timer = null;

    }, delay)

  }

}

/**

 * @param throttle 节流方法

 */

export function throttle(fn, delay = 100) {

  let timer = null;

  return function () {

    if (timer) return;

    timer = setTimeout(() => {

      fn.apply(fn, arguments);

      timer = null;

    }, delay)

  }

}