"并行 (Parallel)" 查询是指同时执行多个查询,以最大化数据获取的并发性。
当并行查询的数量固定时,使用并行查询无需额外操作。只需并排使用任意数量的 TanStack Query 提供的 injectQuery 和 injectInfiniteQuery 函数即可!
export class AppComponent {
// 以下查询将并行执行
usersQuery = injectQuery(() => ({ queryKey: ['users'], queryFn: fetchUsers }))
teamsQuery = injectQuery(() => ({ queryKey: ['teams'], queryFn: fetchTeams }))
projectsQuery = injectQuery(() => ({
queryKey: ['projects'],
queryFn: fetchProjects,
}))
}
export class AppComponent {
// 以下查询将并行执行
usersQuery = injectQuery(() => ({ queryKey: ['users'], queryFn: fetchUsers }))
teamsQuery = injectQuery(() => ({ queryKey: ['teams'], queryFn: fetchTeams }))
projectsQuery = injectQuery(() => ({
queryKey: ['projects'],
queryFn: fetchProjects,
}))
}
TanStack Query 提供了 injectQueries 方法,可用于动态执行任意数量的并行查询。
injectQueries 接收一个包含 queries 键的配置对象,该键的值是查询对象数组。该方法会返回一个查询结果数组:
export class AppComponent {
users = signal<Array<User>>([])
// 请注意 injectQueries 正在开发中,以下代码暂不可用
userQueries = injectQueries(() => ({
queries: users().map((user) => {
return {
queryKey: ['user', user.id],
queryFn: () => fetchUserById(user.id),
}
}),
}))
}
export class AppComponent {
users = signal<Array<User>>([])
// 请注意 injectQueries 正在开发中,以下代码暂不可用
userQueries = injectQueries(() => ({
queries: users().map((user) => {
return {
queryKey: ['user', user.id],
queryFn: () => fetchUserById(user.id),
}
}),
}))
}