fix memo chain example

This commit is contained in:
Evan Almloff 2024-03-06 11:42:31 -06:00
parent 492f0329bf
commit da4d9c70e8

View file

@ -21,25 +21,25 @@ fn app() -> Element {
button { onclick: move |_| value += 1, "Increment" }
button { onclick: move |_| depth += 1, "Add depth" }
button { onclick: move |_| depth -= 1, "Remove depth" }
Child { depth, items, state }
if depth() > 0 {
Child { depth, items, state }
}
}
}
#[component]
fn Child(state: Memo<isize>, items: Memo<Vec<isize>>, depth: ReadOnlySignal<usize>) -> Element {
if depth() == 0 {
return None;
}
// These memos don't get re-computed when early returns happen
let state = use_memo(move || state() + 1);
let item = use_memo(move || items()[depth()]);
let item = use_memo(move || items()[depth() - 1]);
let depth = use_memo(move || depth() - 1);
println!("rendering child: {}", depth());
rsx! {
h3 { "Depth({depth})-Item({item}): {state}"}
Child { depth, state, items }
if depth() > 0 {
Child { depth, state, items }
}
}
}