인프런 커뮤니티 질문&답변

기존에는 UseQueries 를 이런식으로 사용하였는데,

const results = useQueries({
  queries: [
    { queryKey: ['users', id], queryFn: fetchUsers },
    { queryKey: ['teams', id], queryFn: fetchTeams },
    { queryKey: ['projects', id], queryFn: fetchProjects },
  ],
});

현재 공식문서 v5에서는 이런식으로 사용하는걸 봤는데 이러면 queryKey 값이 ['post', id], 로 고정되는거같은데 Key값을 다 다르게 넣을수가 있는건가요? 그리고 보면 하나의 fetchPost 함수로 요청이 들어가는데 api를 병렬요청으로 3개를 가져와야하는데 저런식으로 맵으로 돌아가면 어떻게 각각의 key값을 설정하고 쿼리요청 함수 fetchUsers,fetchTeams,fetchProjects 를 모두 전달할수있는지 이해가 안가서 질문드립니다.

const ids = [1,2,3]
const results = useQueries({
  queries: ids.map(id => (
    { queryKey: ['post', id], queryFn: () => fetchPost(id), staleTime: Infinity },
  )),
})

현재도 아래 방식으로 사용 가능하다면 useQueries의 타입들은 제네릭으로 설정되는걸까요?
키의 개수가 서로다르다면 또 [_1: string] 이런부분이 달라질텐데 기준을 어떻게 잡고 가야하는지 아직 이해를 못한것같습니다.

const results = useQueries({
  queries: [
    { queryKey: ['users', id], queryFn: fetchUsers },
    { queryKey: ['teams', id], queryFn: fetchTeams },
    { queryKey: ['projects', id], queryFn: fetchProjects },
  ],
});

const { data, error } = useQuery<IPost[], Object,IPost[],  [_1: string, 2: string, 3: string] >

const results = useQueries<T[], Object, T[],[?] ({
  queries: [
    { queryKey: ['users', id], queryFn: fetchUsers },
    { queryKey: ['teams', id], queryFn: fetchTeams },
    { queryKey: ['projects', id, searchParams], queryFn: fetchProjects },
  ],
});