a working counter

This commit is contained in:
guochao 2024-10-06 20:57:02 +08:00
parent 851a27e6db
commit 6ed24fb4bc
2 changed files with 21 additions and 29 deletions

View File

@ -1,48 +1,40 @@
use std::rc::Rc;
use yew::{function_component, html, use_context, use_state_eq, Callback, Html};
use yew_agent::{prelude::{use_reactor_bridge, use_reactor_subscription}, reactor::{ReactorEvent, ReactorProvider}};
use yew::{function_component, html, use_state_eq, Callback, Html, UseStateHandle};
use yew_agent::reactor::ReactorProvider;
#[function_component]
pub fn Counter() -> Html {
let count_value = use_state_eq(||None);
let counter = use_reactor_subscription::<crate::frontend::worker::Counter>();
let count_value: UseStateHandle<u64> = use_state_eq(|| 0);
#[cfg(feature = "frontend")]
let callback = {
let counter_handle = counter.clone();
let count_value = count_value.clone();
use yew_agent::reactor::{use_reactor_bridge, ReactorEvent};
let count_value_ = count_value.clone();
let counter_bridge = use_reactor_bridge::<crate::frontend::worker::Counter, _>(move |ev| {
if let ReactorEvent::Output(value) = ev {
count_value_.set(value);
}
});
Callback::from(move |_: yew::MouseEvent| {
counter_handle.send(());
let count_default = Rc::new(0);
let count_result = **(counter.iter().next().unwrap_or(&count_default));
count_value.set(Some(count_result));
counter_bridge.send(());
})
};
let counter_widget = if let Some(value) = *count_value {
html! {
<h1 class="mx-auto my-auto" onclick={callback}>{format!("{}", value)}</h1>
}
} else {
html! {
<h1 class="mx-auto my-auto" onclick={callback}>{"not yet"}</h1>
}
} ;
#[cfg(not(feature = "frontend"))]
let callback = { Callback::noop() };
html! {
<div class="w-full h-full flex">{"Counter: "}
{counter_widget}
<h1 class="mx-auto my-auto" onclick={callback}>{format!("{}", *count_value)}</h1>
</div>
}
}
#[function_component]
pub fn CounterPage() -> Html {
html! {
<ReactorProvider<crate::frontend::worker::Counter> path="/worker.js">
<ReactorProvider<crate::frontend::worker::Counter> path="/static/worker.js">
<Counter />
</ReactorProvider<crate::frontend::worker::Counter>>
}
}
}

View File

@ -5,9 +5,9 @@ use futures::stream::StreamExt;
#[reactor(Counter)]
pub async fn counter(mut scope: ReactorScope<(), u64>) {
let mut count = 0;
while let Some(input) = scope.next().await {
while let Some(_) = scope.next().await {
count += 1;
let _ = scope.send(count+1).await;
let _ = scope.send(count).await;
}
}