useQueries on dependant query

The example on https://tanstack.com/query/latest/docs/vue/guides/dependent-queries is either incorrect or incomplete but I have yet to make is work without warning and weird shenanigans.

Since you are dependant on your first query, your list of queries must be a computed in order to be reactive then you need to call useQueries with your array of queries but since it is a computed in order to get the reactivity you would end up with something like :

const results = useQueries({ queries: queriesList.value })

const results = useQueries({ queries: queriesList.value })

const results = useQueries({ queries: queriesList.value })

const results = useQueries({ queries: queriesList.value })

but if you do that you will always have the queriesList when it is empty so you end up having to also wrap it in a computed ? with something like that :

const results = computed(() => {
  return useQueries({ queries: queriesList.value })
})

const results = computed(() => {
  return useQueries({ queries: queriesList.value })
})

const results = computed(() => {
  return useQueries({ queries: queriesList.value })
})

const results = computed(() => {
  return useQueries({ queries: queriesList.value })
})

all of this seems totally wrong to me. It also trigger somehow a warning saying that my useQueries is not used inside setup.

Does anyone have an example or can point out what I am missing.

Dependent Queries | TanStack Query Docs

useQuery dependent Query

Dependent (or serial) queries depend on previous ones to finish before they can execute. To achieve this, it's as easy as using the enabled option to tell a query when it is ready to run:

useQueries on dependant query

Similar Threads

Similar Threads

Similar Threads