有依赖的查询

依赖查询依赖于先前的查询，要实现这一点，需要使用enable选项来告诉查询何时执行：

useQuery 依赖查询

依赖查询（或串行查询）依赖于前一个查询的完成，才能执行。要实现这一点，简单的方法是使用enabled选项来告诉查询何时准备好运行：

// 获取用户
const { data: user } = useQuery({
  queryKey: ["user", email],
  queryFn: getUserByEmail
});

const userId = user?.id;

// 然后获取用户的项目
const {
  status,
  fetchStatus,
  data: projects
} = useQuery({
  queryKey: ["projects", userId],
  queryFn: getProjectsByUser,
  // 在 userId 存在之前，查询不会执行
  enabled: !!userId
});

在查询开始时，projects 查询的状态是：
status: 'pending'
isPending: true
fetchStatus: 'idle'

一旦用户数据可用，projects 查询将启用，状态变为：
status: 'pending'
isPending: true
fetchStatus: 'fetching'

一旦获取到项目，状态将变为：
status: 'success'
isPending: false
fetchStatus: 'idle'

useQueries 依赖查询

动态并行查询——useQueries也可以依赖于先前的查询，以下是如何实现的：

// 获取用户ID
const { data: userIds } = useQuery({
  queryKey: ["users"],
  queryFn: getUsersData,
  select: (users) => users.map((user) => user.id)
});

// 然后获取用户的消息
const usersMessages = useQueries({
  queries: userIds
    ? userIds.map((id) => {
        return {
          queryKey: ["messages", id],
          queryFn: () => getMessagesByUsers(id)
        };
      })
    : [] // 如果 users 为 undefined，则返回空数组
});

性能注意事项

依赖查询本质上形成了请求瀑布效应，这会影响性能。假设两个查询所需时间相同，那么串行执行它们的时间总是会是并行执行的两倍，这对于高延迟的客户端尤为不利。如果可能，最好重新设计后端 API，使得两个查询能够并行获取，尽管这在实际操作中并不总是可行的。

在上面的例子中，除了先获取 getUserByEmail 才能获取 getProjectsByUser，引入一个新的 getProjectsByUserEmail 查询将会扁平化这个瀑布。