如何延迟调度动作（去抖）

Question

我有一个场景，我需要在输入完成后两秒调度一个操作。（假设用户在没有 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 功能

Answer 1

你可以做这样的事情。

let timeOut = null;
SearchFilter: (name, value) => {
    clearTimeout(timeOut);
    dispatch(SearchFilter(name, value));
    timeOut = setTimeout(() => {
            dispatch(callfunction());
        }, 2000);
    }

它将调度等待 2 秒输入的操作。