Question

我有一个项目列表，用户可以重新排序项目的顺序。更新列表顺序后，会立即触发onSortEnd函数。它将新订单发送到我的服务器以更新订单。我有网络请求正常工作，但我尝试实施去抖动以限制订单发送到我的服务器的次数。例如，如果用户在10秒的范围内更改订单3次，我实际上只需要发送最后一个订单，而不是全部3.我的请求工作正常，但由于某种原因，我的请求被解雇为一旦列表被重新排序，而不是去抖动，我不太清楚为什么。

去抖功能：

const debounce = (fn, delay) => {
  let timer = null;
  return () => {
    const context = this;
    const args = arguments;
    clearTimeout(timer);
    timer = setTimeout(() => {
      fn.apply(context, args);
    }, delay);
  };
};

调用debounce（我的React组件中的类方法在列表排序时触发）：

onSortEnd = () => {
  // this.props.updateItems makes the network request and works just fine...
  debounce(this.props.updateItems(updatedList), 3000, false);
};

我更喜欢在vanilla Javascript中这样做。非常感谢任何和所有的帮助。谢谢！

Answer 1

尝试RxJS＃debounce，请参阅RxJS-debounce

去抖动网络请求

1 个答案: