TanStackT
TanStack3y ago
4 replies
primary-violet

Query Key Array not Updating with key is changed

I'm running into an issue where my query key array isn't updating when I change a selected warehouse ID in a dropdown menu. As a result,
useQuery
is using old query data instead of fetching new data for the selected warehouse ID. I'm not sure how to update the query key array when the selected warehouse ID changes, and I was wondering if you could provide any guidance on how to resolve this issue? Thank you!

I've attached a video to this message that explains the issue in more detail.

import { useQuery } from '@tanstack/vue-query'

const fetchTotalSellers = async warehouseId => {
  const res = await axios.get('/analytics/getTotalSellers', {
    params: {
      warehouseId,
    },
  })
  return res.data
}

const userStore = useUserStore() // pinia store
const { data } = useQuery(
  ['analytics', userStore.selectedWarehouse],
  () => fetchTotalSellers(userStore.selectedWarehouse),
  {
    refetchOnWindowFocus: false,
    onSuccess: data => {
      console.log('data', data)
    },
  },
)
Was this page helpful?