Handling undefined errors on TRPC dependent queries
Really loving TRPC and relying more and more on the Tanstack to learn a bit more. In my app, largely a very simple modification of the base from TRPC, I would like to fetch some data and pass this to a second dependent query.
I believe this is achieved as follows:
const { data: product } = api.product.getUnique.useQuery({ id: pid });
const options = api.option.getAll.useQuery(
{
product: product.productSize,
region: product.productRegion,
},
{ enabled: !!product }
);
However, as much as I try, I continue to get ‘product could be undefined’ type errors in the input pass in the options query for both product and region.
What is the correct way to use enabled to wait on the output of one TRPC call to avoid this?
I believe this is achieved as follows:
const { data: product } = api.product.getUnique.useQuery({ id: pid });
const options = api.option.getAll.useQuery(
{
product: product.productSize,
region: product.productRegion,
},
{ enabled: !!product }
);
However, as much as I try, I continue to get ‘product could be undefined’ type errors in the input pass in the options query for both product and region.
What is the correct way to use enabled to wait on the output of one TRPC call to avoid this?
Similar Threads
Was this page helpful?
