timeout_count.rs 870 B

12345678910111213141516171819202122232425262728293031323334
  1. // https://jakelazaroff.com/words/were-react-hooks-a-mistake/
  2. use dioxus::prelude::*;
  3. fn main() {
  4. dioxus_web::launch::launch(app, vec![], Default::default());
  5. }
  6. fn app() -> Element {
  7. let mut count = use_signal(|| 0);
  8. let mut started = use_signal(|| false);
  9. let mut start = move || {
  10. if !started() {
  11. let alert = move || gloo_dialogs::alert(&format!("Your score was {count}!",));
  12. gloo_timers::callback::Timeout::new(5_000, alert).forget();
  13. }
  14. started.set(true); // this cannot be done inside condition or infinite loop
  15. };
  16. rsx! {
  17. button {
  18. onclick: move |_event| {
  19. start();
  20. count += 1;
  21. },
  22. if started() {
  23. "Current score: {count}"
  24. } else {
  25. "Start"
  26. }
  27. }
  28. }
  29. }