Add demo of hydrating suspensed content

sycamore-rs · Sep 16, 2024 · 1d45224 · 1d45224
1 parent 9dea370
commit 1d45224
Showing 1 changed file with 20 additions and 0 deletions.
diff --git a/examples/ssr-streaming/src/app.rs b/examples/ssr-streaming/src/app.rs
@@ -29,6 +29,17 @@ fn DelayedText(delay_ms: u64) -> View {
     }
 }
 
+#[component]
+fn CounterButton() -> View {
+    let mut state = create_signal(0);
+
+    view! {
+        button(r#type="button", on:click=move |_| state += 1) {
+            (state.get())
+        }
+    }
+}
+
 #[component]
 fn App() -> View {
     let delays = [1000, 2000, 1000];
@@ -83,6 +94,15 @@ fn App() -> View {
                 DelayedText(delay_ms=1000)
             }
         }
+
+        p {
+            strong { "Suspense content is hydrated" }
+        }
+        Suspense(fallback=|| view! { "Loading interactive content..."}) {
+            Delayed(delay_ms=1000) {
+                CounterButton {}
+            }
+        }
     }
 }