2023-04-09 14:54:18 +00:00
|
|
|
// https://jakelazaroff.com/words/were-react-hooks-a-mistake/
|
|
|
|
use dioxus::prelude::*;
|
|
|
|
|
|
|
|
fn main() {
|
2024-01-19 22:19:49 +00:00
|
|
|
dioxus_web::launch::launch(app, vec![], Default::default());
|
2023-04-09 14:54:18 +00:00
|
|
|
}
|
|
|
|
|
2024-01-14 04:51:37 +00:00
|
|
|
fn app() -> Element {
|
2024-01-19 22:19:49 +00:00
|
|
|
let mut count = use_signal(|| 0);
|
|
|
|
let mut started = use_signal(|| false);
|
2023-04-09 14:54:18 +00:00
|
|
|
|
2024-01-19 22:19:49 +00:00
|
|
|
let mut start = move || {
|
|
|
|
if !started() {
|
|
|
|
let alert = move || gloo_dialogs::alert(&format!("Your score was {count}!",));
|
2023-04-09 14:54:18 +00:00
|
|
|
gloo_timers::callback::Timeout::new(5_000, alert).forget();
|
|
|
|
}
|
|
|
|
started.set(true); // this cannot be done inside condition or infinite loop
|
|
|
|
};
|
|
|
|
|
2024-01-14 05:12:21 +00:00
|
|
|
rsx! {
|
2023-04-09 14:54:18 +00:00
|
|
|
button {
|
|
|
|
onclick: move |_event| {
|
|
|
|
start();
|
2024-01-19 22:19:49 +00:00
|
|
|
count += 1;
|
2023-04-09 14:54:18 +00:00
|
|
|
},
|
2024-01-19 22:19:49 +00:00
|
|
|
|
|
|
|
if started() {
|
|
|
|
"Current score: {count}"
|
2024-01-11 03:33:34 +00:00
|
|
|
} else {
|
|
|
|
"Start"
|
|
|
|
}
|
2023-04-09 14:54:18 +00:00
|
|
|
}
|
2024-01-14 05:12:21 +00:00
|
|
|
}
|
2023-04-09 14:54:18 +00:00
|
|
|
}
|