Javascript 反应查询-在所有请求完成后触发一次功能

我正在寻找一个解决方案，在所有请求完成后如何启动函数

我正在使用React Query来管理外部数据状态和

UseVaritation

hook，因为我需要在选择更改时重新获取数据

const fetcher1 = async () => await axios.get('XXX');
const fetcher2 = async () => await axios.get('XXX');

const { data, isLoading, mutate: fetchData1 } = useMutation(fetcher1)
const { data2, isLoading: isLoading2, mutate: fetchData2 } = useMutation(fetcher2)

function runWhenReady() {
 console.log("Ready!")
}

// re-fetch on select change and initial fetch
useEffect(() => {
 fetchData1();
 fetchData2();
}, [selectValueChanged])

我想观察请求状态的变化，并在所有请求都未挂起时触发

runwhenrady（）

。我想我需要等一等，例如1来做决定

有人能帮我准备监控请求状态的实用程序吗？

---

谢谢

您可以查看isSuccess以查看成功的请求何时发生

const { data, isLoading, mutate: fetchData1, isSuccess: 1isSuccess } = useMutation(fetcher1)
const { data2, isLoading: isLoading2, mutate: fetchData2, isSuccess: 2isSuccess } = useMutation(fetcher2)


useEffect(() => {
  if(1isSuccess && 2isSuccess){
    runWhenReady();
  }
}, [1isSuccess, 2isSuccess]);

---

mutateAsync

很可能就是您想要的，因为

mutateAsync

返回一个正常的承诺，即您可以链接在一起。请注意，您必须亲自捕捉错误，否则您将看到未经处理的承诺拒绝

const { data, isLoading, mutateAsync: fetchData1, isSuccess: 1isSuccess } = useMutation(fetcher1)
const { data2, isLoading: isLoading2, mutateAsync: fetchData2, isSuccess: 2isSuccess } = useMutation(fetcher2)

<button onClick={() => {
    Promise.allSettled([fetchData1(), fetchData2()])
        .then(results => runWhenReady())
        .catch(...)
} />

const{data，isLoading，mutateAsync:fetchData1，issAccess:1issAccess}=useMutation（fetcher1）
const{data2，isLoading:isLoading2，mutateAsync:fetchData2，issAccess:2issAccess}=useMutation（fetcher2）
{
Promise.allSettled（[fetchData1（），fetchData2（）]））
。然后（结果=>runWhenReady（））
.catch（…）
} />

检查此项：