updated the example to work with hydartion

This commit is contained in:
Jose Quesada 2022-12-07 10:04:54 -06:00
parent 46ef1bcf5d
commit c239716170
2 changed files with 12 additions and 21 deletions

View file

@ -13,19 +13,10 @@ pub fn App(cx: Scope) -> View {
#[component]
pub fn ComponentA(cx: Scope) -> View {
let (value, set_value) = create_signal(cx, "".to_string());
div(cx)
.child(
input(cx)
.attr("type", "text")
.prop("value", (cx, value))
)
.child(
p(cx)
.child("Value is: ")
.child((cx, value))
.child("!")
)
let (value, set_value) = create_signal(cx, "".to_string());
div(cx)
.child(input(cx).attr("type", "text").prop("value", (cx, value)))
.child(p(cx).child("Value is: ").child((cx, value)).child("!"))
.into_view(cx)
}
@ -33,10 +24,10 @@ cfg_if::cfg_if! {
if #[cfg(feature = "hydrate")] {
use wasm_bindgen::prelude::wasm_bindgen;
#[wasm_bindgen]
pub fn hydrate() {
#[wasm_bindgen(start)]
pub fn start() {
console_error_panic_hook::set_once();
leptos::hydrate(body().unwrap(), move |cx| {
leptos::mount_to_body(move |cx| {
view! { cx, <App/> }
});
}

View file

@ -1,11 +1,11 @@
use actix_web::{web, App, HttpResponse, HttpServer};
use actix_files::Files;
use leptos::*;
use actix_web::{web, App, HttpResponse, HttpServer};
use hydration_test::*;
use leptos::*;
#[actix_web::main]
async fn main() -> std::io::Result<()> {
HttpServer::new(|| App::new()
HttpServer::new(|| App::new()
.service(Files::new("/pkg", "./pkg"))
.route("/", web::get().to(
|| async {
@ -23,7 +23,7 @@ async fn main() -> std::io::Result<()> {
format!(r#"<!DOCTYPE html>
<html>
<head>
<script type="module">import init, {{ hydrate }} from '/pkg/hydration_test.js'; init().then(hydrate);</script>
<script type="module">import init from '/pkg/hydration_test.js'; init();</script>
</head>
<body>{html}</body>
</html>
@ -35,4 +35,4 @@ async fn main() -> std::io::Result<()> {
.bind(("127.0.0.1", 8080))?
.run()
.await
}
}