docs(preloading): correct effect snippets (#3204)

Author: 3fuyang

docs/framework/react/guide/preloading.md

@@ -107,15 +107,19 @@ function Component() {
   const router = useRouter()
 
   useEffect(() => {
-    try {
-      const matches = await router.preloadRoute({
-        to: postRoute,
-        params: { id: 1 },
-      })
-    } catch (err) {
-      // Failed to preload route
+    async function preload() {
+      try {
+        const matches = await router.preloadRoute({
+          to: postRoute,
+          params: { id: 1 },
+        })
+      } catch (err) {
+        // Failed to preload route
+      }
     }
-  }, [])
+
+    preload()
+  }, [router])
 
   return <div />
 }
@@ -128,17 +132,21 @@ function Component() {
   const router = useRouter()
 
   useEffect(() => {
-    try {
-      const postsRoute = router.routesByPath['/posts']
-      await Promise.all([
-        router.loadRouteChunk(router.routesByPath['/']),
-        router.loadRouteChunk(postsRoute),
-        router.loadRouteChunk(postsRoute.parentRoute),
-      ])
-    } catch (err) {
-      // Failed to preload route chunk
+    async function preloadRouteChunks() {
+      try {
+        const postsRoute = router.routesByPath['/posts']
+        await Promise.all([
+          router.loadRouteChunk(router.routesByPath['/']),
+          router.loadRouteChunk(postsRoute),
+          router.loadRouteChunk(postsRoute.parentRoute),
+        ])
+      } catch (err) {
+        // Failed to preload route chunk
+      }
     }
-  }, [])
+
+    preloadRouteChunks()
+  }, [router])
 
   return <div />
 }