如何延迟调度动作(去抖动)

我有一个场景,我需要在输入完成两秒后调度一个动作。(假设用户在没有 2 秒间隔的情况下输入 1000,所以我只需要在输入 1000 和 2 秒后调度操作)。


以前我使用debounce-promise来做这样的事情,我需要从 API 获取下拉列表,但为此我直接在组件中使用了带有 AJAX 调用的库。它工作正常。


现在我需要分派这样的动作。


  // should be dispatched only for the last request

  const getRateReq = dispatch(getRates());


  const getRate = debounce(getRateReq, 2000, {

    leading: false,

  });


  const onChange = (e) => {

     setValue(e.target.value);

     getRate(e.target.value);

  }

现在动作也只在完成输入两秒后调度。但是随后它会发出 1、10、100、1000 的所有请求(即使 1000 是在没有两秒间隔的情况下输入的)。如何在 2 秒内修复此问题并仅针对最后一个输入调度操作?


任何帮助,将不胜感激。谢谢


编辑:添加了基本的 onChange 功能


慕妹3146593
浏览 166回答 2
2回答

紫衣仙女

你可以做这样的事情。let timeOut = null;SearchFilter: (name, value) => {    clearTimeout(timeOut);    dispatch(SearchFilter(name, value));    timeOut = setTimeout(() => {            dispatch(callfunction());        }, 2000);    }它将调度等待 2 秒输入的动作。

繁星淼淼

您需要使用 loadash 的 debounce 方法并执行以下操作:onChange = debounce(anyInput => {     }, 2000);因此,您必须在完成输入后 2 秒后在 onchange 方法中进行 API 调用。不确定这是您要问的吗?
打开App,查看更多内容
随时随地看视频慕课网APP

相关分类

JavaScript