leptos-use/examples/use_debounce_fn/src/main.rs

38 lines
1.1 KiB
Rust
Raw Normal View History

2023-05-26 19:27:42 +01:00
use leptos::*;
2023-05-31 05:56:32 +01:00
use leptos_use::docs::{demo_or_body, Note};
use leptos_use::{use_debounce_fn_with_options, DebounceOptions};
2023-05-26 19:27:42 +01:00
#[component]
2023-07-27 18:06:36 +01:00
fn Demo() -> impl IntoView {
let (click_count, set_click_count) = create_signal(0);
let (debounced_count, set_debounced_count) = create_signal(0);
2023-05-26 19:27:42 +01:00
let debounced_fn = use_debounce_fn_with_options(
move || set_debounced_count.set(debounced_count.get_untracked() + 1),
2023-05-26 19:27:42 +01:00
1000.0,
DebounceOptions::default().max_wait(Some(5000.0)),
2023-05-26 19:27:42 +01:00
);
2023-07-27 19:48:21 +01:00
view! {
<button on:click=move |_| {
set_click_count.set(click_count.get_untracked() + 1);
debounced_fn();
}>
2023-05-26 19:27:42 +01:00
"Smash me!"
</button>
2023-05-31 05:56:32 +01:00
<Note>"Delay is set to 1000ms and max_wait is set to 5000ms for this demo."</Note>
2023-07-27 19:48:21 +01:00
<p>"Button clicked: " {click_count}</p>
<p>"Event handler called: " {debounced_count}</p>
2023-05-26 19:27:42 +01:00
}
}
fn main() {
_ = console_log::init_with_level(log::Level::Debug);
console_error_panic_hook::set_once();
2023-07-27 18:06:36 +01:00
mount_to(demo_or_body(), || {
2023-07-27 19:48:21 +01:00
view! { <Demo/> }
2023-05-26 19:27:42 +01:00
})
}