通过 vue customRef 实现 防抖

function useDebounceRef(value, delay = 200) {
  let timeout;
  return customRef((track, trigger) => {
    return {
      get: () => {
        track();
        return value;
      },
      set: (newValue) => {
        clearTimeout(timeout);
        timeout = sietTimeout(() => {
          value = newValue;
        }, delay);
      },
    };
  });
}

引申防抖函数

定义 一定时间内只执行一次，如果再次触发，则重新计时

function debounce(fn, delay = 200) {
  let timeout = null;
  return function (...args) {
    clearTimeout(timeout);
    timeout = setTimeout(() => {
      fn.apply(this, args);
    }, delay);
  };
}

引申节流函数

定义 一定时间只执行一次，如果在一定时间内再次触发，则不执行

function throttle(fn, delay = 200) {
  let timeout = null;
  return function (...args) {
    if (!timeout) {
      timeout = setTimeout(() => {
        fn.apply(this, args);
        timeout = null;
      }, delay);
    }
  };
}