TanStackT
TanStack4y ago
2 replies
skinny-azure

exhaustive-deps with a ref

I've read a couple threads here and on GitHub but couldn't find a clear answer.

Is the lint rule correct and should I add articleUuid?.value to the
queryKey
array, or is the lint rule wrong?

import { useQuery } from "@tanstack/vue-query";
import { computed, Ref } from "vue";

export const useArticleQuery = (articleUuid?: Ref<string | undefined>) => {
  const enabled = computed(() => !!articleUuid?.value?.length);
  return useQuery({
    queryKey: ["api-article", articleUuid], // "The following dependencies are missing in your queryKey: articleUuid?.value" eslint@tanstack/query/exhaustive-deps
    queryFn: () => Promise.resolve(`/api/articles/${articleUuid?.value}`),
    enabled,
  });
};
Was this page helpful?