Error: Route "/dashboard/assignment/[id]": A component accessed data, headers, params, searchParams,
Answered
Giant Chinchilla posted this in #help-forum
Giant ChinchillaOP
Error: Route "/dashboard/assignment/[id]": A component accessed data, headers, params, searchParams, or a short-lived cache without a Suspense boundary nor a "use cache" above it. We don't have the exact line number added to error messages yet but you can see which component in the stack below. See more info: https://nextjs.org/docs/messages/next-prerender-missing-suspensetype Params = Promise<{id: string}>;
export default async function AssignmentPage(props: { params: Params }) {
const params = await props.params;
return (
<div>
Assignment Page {params.id}
</div>
)
}What am i doing wrong? This is happening during build.
Answered by B33fb0n3
Surround your page with a suspense boundary to remove this error. For pages (page.tsx) you can do that by adding a „loading.tsx“ to your current path
3 Replies
@Giant Chinchilla Error: Route "/dashboard/assignment/[id]": A component accessed data, headers, params, searchParams, or a short-lived cache without a Suspense boundary nor a "use cache" above it. We don't have the exact line number added to error messages yet but you can see which component in the stack below. See more info: https://nextjs.org/docs/messages/next-prerender-missing-suspense
js
type Params = Promise<{id: string}>;
export default async function AssignmentPage(props: { params: Params }) {
const params = await props.params;
return (
<div>
Assignment Page {params.id}
</div>
)
}
What am i doing wrong? This is happening during build.
Surround your page with a suspense boundary to remove this error. For pages (page.tsx) you can do that by adding a „loading.tsx“ to your current path
Answer
sure thing