TanStackT
TanStack•16mo ago
instant-harlequin

Prevent react query from creating empty keys even happening when enabled is not satisfied

Hi,

I've find some weird case with useQuery, where create two keys while fetching, where the first is the one with the data is empty or undefined.
So in simple terms I have two keys like

['orders', { userId: '' }] // data is null
['orders', { userId: '1' }] // data is not null


query is:

useQuery( queryKey: ['orders', { userId: ${userId}, enabled: !!userId, fetch: () => ... }])


Really this is not a issue at all, just I don't like empty keys with null result.

Is this by nature functionality, or my generic fetcher on top of useQuery mess up the keys?

const queryKey = createKey(...);
useQuery({
        queryKey,
        queryFn: () => {
            return fetcher<T>({
                url: pathBuilder(...),
                method: 'get',
            });
        },
        staleTime,
        gcTime,
        retry: 0,
        select,
        enabled: !!(queryKey && enabled)
    });


Here is one example:
["configuration",{"workspaceId":"6687abcc5e279ada4f4123c7"}]

["configuration",{"workspaceId":""}]
Was this page helpful?