Question

在我的 React 应用程序中，用户可以在表格中向下滚动，当他们几乎在底部时，表格会触发加载后续数据的请求。我的目标是限制 axios 同时发出 1 个以上的后续数据请求。我试图限制这种情况触发的重复请求：

if (!isLoading) { // isLoading is set to true in the requestData method
   requestData();
}

但这还不够，如果用户快速滚动多个请求，直到 isLoading 设置为 true。

我发现 axios 拦截器 可能是一个解决方案。所以目前我正在使用此代码来防止发出超过 1 个请求：

let subsequentDataRequestInProgress = false;

apiClientQESubsequentRequest.interceptors.request.use((request) => {
    if (subsequentDataRequestInProgress) { // if there's a pending request, don't send another one
      return Promise.reject('Duplicate request.');
    } else {
      subsequentDataRequestInProgress = true;
    }
  return request;

}, (error) => {
  return Promise.reject(error);
});

apiClientQESubsequentRequest.interceptors.response.use((response) => {
  // got a response, we're able to handle another request
  subsequentDataRequestInProgress = false;
  return Promise.resolve(response)
}, (error) => {
  return Promise.reject(error);
});

export { apiClientQESubsequentRequest };

是否有更好的解决方案来解决我的问题？您认为这是一个合理的解决方案吗？

防止 axios 同时向特定端点发出多个请求

0 个答案: