依赖于多个先前 refetchInterval 查询的串行查询

Question

我在应用程序中有一个轮询流程，它是一系列查询运行，依赖于之前的完成。在我开始使用 react-query 之前，我只使用了 async/await 和 Promise.all() 来了解之前的请求是否完成。

流程示例（使用 react-query 之前）：

setInterval(async () => {
    await Promise.all([query1, query2]);
    await query3();
}, INTERVAL_TIME);

这样我得到了一个轮询间隔，我知道 query3 只会在 query1 && query2 完成后运行。

现在我正在努力使用react-query 来获得这种行为。我知道 enabled 参数可以传递给 useQuery 钩子，但它只适用于第一次运行：

const {data: data1} = useQuery('query1', query1, { refetchInterval: INTERVAL_TIME });
const {data: data2} = useQuery('query2', query2, { refetchInterval: INTERVAL_TIME });
const {data: data3} = useQuery('query3', query3, { refetchInterval: INTERVAL_TIME , enabled: !!data1 && !!data3})

上面的 sn-p 给我的结果是第一次间隔运行正常，query3 仅在我有 data1 和 data2 之后运行，但在第二次间隔运行时，因为 data1 和 data2 已经不是假的它只是并行发送所有查询，这不是预期的结果。

可能值得一提的是问题的背景和数据。 data1 和 data2 不相互依赖（可以并行完成），但应在 data3 之前获取，因为 data3 是根据来自 data1 和 data2 的参数呈现的

你能给我建议吗？谢谢。

Answer 1

您可以使用此处记录的“相关查询”：https://react-query.tanstack.com/docs/guides/queries#dependent-queries

这可能会阻止您的第三个查询在 data1 和 data2 可用之前运行。