how to pass trpc typescript between parent and children ?
I have data types when using useQuery but I want to also include these types inside the component that I am using here is an example
const { data , isLoading, refetch } = api.users.submission.useQuery(undefined, { refetchOnWindowFocus: false });
<Submissions refetch={refetch} data={data} />
export default function Submission({refetch,data}) {}
I want when I use data into Submission component I can see the data types that comes from useQuery, how can I achieve that ?4 Replies
you can use the RouterOutputs of the path you're querying
is there a tutorial for this or an example how can I do that ?
oh I see so I have to use it like this inside a variable and then use it ?
const fils = data as RouterOutputs
fils.users.submisison
can I use it inside the props instead or its only inside a variable ?I don't really know what you're saying here, but what Liltripple was referring to was RouterOutputs, which would something like this
export type RouterOutputs = inferRouterOutputs<AppRouter>;
and then define your type, which for you would be something like
export type Submission = RouterOutputs["users"]["submission"]
https://trpc.io/docs/client/vanilla/infer-typesInferring Types | tRPC
It is often useful to access the types of your API within your clients. For this purpose, you are able to infer the types contained in your AppRouter.
yes i got it working , its my first time knowning about output I think i have to check trpc course because there is still alot of information missing , thanks man 🙂