Skip to content

防抖

用法

可以通过 debounce 参数来控制 useFetch 是否防抖

ts
const { execute } = useFetch(url, { immediate: false, debounce: 100 });

setTimeout(() => execute(), 30);
setTimeout(() => execute(), 30);
setTimeout(() => execute(), 30); // 只生效一次

提示

  • debounce的条件对响应式更新refetch、自动更新refresh、手动执行execute都生效

  • 设置debounceexecute执行后不再返回 Promise, 可以通过promise$.then来进行后续动作

高阶用法

也可以通过 debounce的 await 和 options 参数来控制 useFetch 是否防抖, 用法和效果与 lodash.debounce 相同

ts
const { execute } = useFetch(url, {
  immediate: false,
  debounce: { wait: 100, options: { leading: true, trailing: true } },
});

setTimeout(() => execute(), 30); // 生效一次
setTimeout(() => execute(), 30);
setTimeout(() => execute(), 30); // 生效一次