如何在useEffect中一一执行请求

Question

我有 useEffect 在更改依赖项（部门和两个日期字段）时执行请求。

useEffect(() => {
    getFilteredRestReport({
      date_start: formatDatePatchPoint(date[0]),
      date_end: formatDatePatchPoint(date[1]),
      department,
    });
  }, [date, department])

当我向一个空部门发出请求时，该请求需要很长时间才能完成，如果在这个请求期间我发出请求，例如对于某个部门，它会比没有该部门时先执行，但是当加载没有部门的请求，它将替换数据，尽管在前面的过滤器中，我选择了最后一个请求部门。而问题是如何停止一个不必要的请求，或者如何将请求一一执行？

我尝试使用 async/await 来做到这一点

const request = async () => {
    await getFilteredRestReport({     
      date_start: formatDatePatchPoint(date[0]),
      date_end: formatDatePatchPoint(date[1]),
      department,
    });
  };

  useEffect(() => {
    request()
  }, [date, department]);

Answer 1

我不确定我是否理解这个问题。

如果您希望仅在 department 有值时才发出请求，那么您可以在 useEffect 中添加一个检查，并仅在满足条件时调用 request() 。 当部门未定义时，这将停止请求。

    const request = async () => {
    await getFilteredRestReport({     
      date_start: formatDatePatchPoint(date[0]),
      date_end: formatDatePatchPoint(date[1]),
      department,
    });
  };

  useEffect(() => {
    if(department) {request()}
  }, [date, department]);

如果这对您有帮助，请告诉我。如果没有，请尝试解释我错过了什么。