diff --git a/docs/framework/react/guides/advanced-ssr.md b/docs/framework/react/guides/advanced-ssr.md
index db96d36af8..276a698947 100644
--- a/docs/framework/react/guides/advanced-ssr.md
+++ b/docs/framework/react/guides/advanced-ssr.md
@@ -138,7 +138,7 @@ function Posts() {
   // ...
 }
 
-export default PostsRoute({ dehydratedState }) {
+export default function PostsRoute({ dehydratedState }) {
   return (
     <HydrationBoundary state={dehydratedState}>
       <Posts />
diff --git a/docs/framework/react/guides/ssr.md b/docs/framework/react/guides/ssr.md
index e79bbe789d..a8b7a79de9 100644
--- a/docs/framework/react/guides/ssr.md
+++ b/docs/framework/react/guides/ssr.md
@@ -248,7 +248,7 @@ function Posts() {
   // ...
 }
 
-export default PostsRoute({ dehydratedState }) {
+export default function PostsRoute({ dehydratedState }) {
   return (
     <HydrationBoundary state={dehydratedState}>
       <Posts />
@@ -326,7 +326,7 @@ function Posts() {
   // ...
 }
 
-export default PostsRoute() {
+export default function PostsRoute() {
   const { dehydratedState } = useLoaderData<typeof loader>();
   return (
     <HydrationBoundary state={dehydratedState}>
@@ -341,7 +341,7 @@ export default PostsRoute() {
 Having this part in every route might seem like a lot of boilerplate:
 
 ```tsx
-export default PostsRoute({ dehydratedState }) {
+export default function PostsRoute({ dehydratedState }) {
   return (
     <HydrationBoundary state={dehydratedState}>
       <Posts />