2023-07-24 23:18:11 +01:00
|
|
|
use leptos::*;
|
2023-07-27 23:53:26 +01:00
|
|
|
use leptos_use::docs::{demo_or_body, Note};
|
2023-07-24 23:18:11 +01:00
|
|
|
use leptos_use::signal_debounced;
|
|
|
|
|
|
|
|
#[component]
|
2023-07-27 18:06:36 +01:00
|
|
|
fn Demo() -> impl IntoView {
|
2023-07-27 23:53:26 +01:00
|
|
|
let (input, set_input) = create_signal("".to_string());
|
2023-09-12 15:29:09 +01:00
|
|
|
let debounced: Signal<String> = signal_debounced(input, 1000.0);
|
2023-07-24 23:18:11 +01:00
|
|
|
|
2023-07-27 23:53:26 +01:00
|
|
|
view! {
|
|
|
|
<div>
|
|
|
|
<input
|
|
|
|
type="text"
|
|
|
|
value=input
|
|
|
|
on:input=move |event| set_input(event_target_value(&event))
|
|
|
|
placeholder="Try to type quickly, then stop..."
|
|
|
|
/>
|
|
|
|
<Note>
|
|
|
|
Delay is set to 1000ms for this demo.
|
|
|
|
</Note>
|
|
|
|
<p>
|
|
|
|
Input signal:
|
|
|
|
{input}
|
|
|
|
</p>
|
|
|
|
<p>
|
|
|
|
Debounced signal:
|
|
|
|
{debounced}
|
|
|
|
</p>
|
|
|
|
</div>
|
|
|
|
}
|
2023-07-24 23:18:11 +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-07-24 23:18:11 +01:00
|
|
|
})
|
|
|
|
}
|