并行查询 Parallel Queries

“并行”查询是指并行执行的查询，或者是同时执行的查询。用以最大化查询并发性。

手动并行查询

如果并行查询的数量没有变化，则无需付出额外的努力即可使用并行查询。 只需并排使用任意数量的 Vue Query 的useQuery和useInfiniteQueryHooks 即可！

<script setup lang="ts">
  // 下面的查询将自动地并行执行
  const usersQuery = useQuery({ queryKey: ["users"], queryFn: fetchUsers });
  const teamsQuery = useQuery({ queryKey: ["teams"], queryFn: fetchTeams });
  const projectsQuery = useQuery({
    queryKey: ["projects"],
    queryFn: fetchProjects,
  });
</script>

使用useQueries的动态并行查询

如果你需要执行的查询数量在每次渲染之间会变化，则不能使用手动查询，因为这将违反 hook 的规则。 相反，Vue Query 提供了useQueries的 Hook，你可以使用它来动态地并行执行尽可能多的查询。

useQueries接受一组作为查询配置的对象，并以数组形式返回查询的结果：

const users = computed(...)
const queries = computed(() => users.value.map(user => {
    return {
      queryKey: ['user', user.id],
      queryFn: () => fetchUserById(user.id),
    }
  })
);
const userQueries = useQueries({queries: queries})