Is there a way to query a single post in TRPC and Next JS based on a dynamic url without using SSR or SSG? I have tried adding as string to router.query.id but encountered a TRPC error (only happening during the first load) because router.query.id is initially an empty object, not a string. How can this be achieved without triggering the initial TRPC error?
import { useRouter } from "next/router";
import { api } from "~/utils/api";
const SinglePost = () => {
const router = useRouter();
const { data } = api.post.getById.useQuery({
id: router.query.id as string,
});
return (
<div>
{data}
</div>
);
};
export default SinglePost;