2023-06-12 11:37:20 +01:00
|
|
|
use leptos::*;
|
|
|
|
use leptos_use::docs::demo_or_body;
|
|
|
|
use leptos_use::math::use_abs;
|
|
|
|
|
|
|
|
#[component]
|
2023-07-27 18:06:36 +01:00
|
|
|
fn Demo() -> impl IntoView {
|
|
|
|
let (value, set_value) = create_signal(-32.25);
|
2023-06-12 11:37:20 +01:00
|
|
|
|
2023-07-27 18:06:36 +01:00
|
|
|
let result: Signal<f64> = use_abs(value);
|
2023-06-12 11:37:20 +01:00
|
|
|
|
2023-07-27 18:06:36 +01:00
|
|
|
view! { <input
|
2023-06-12 11:37:20 +01:00
|
|
|
class="block"
|
2023-06-21 13:09:00 +02:00
|
|
|
prop:value=move || value.get()
|
|
|
|
on:input=move |e| set_value.set(event_target_value(&e).parse().unwrap())
|
2023-06-12 11:37:20 +01:00
|
|
|
type="range"
|
|
|
|
min="-30"
|
|
|
|
max="10"
|
|
|
|
step="0.1"
|
|
|
|
/>
|
2023-06-21 13:09:00 +02:00
|
|
|
<p>"Value: " {move || value.get()}</p>
|
|
|
|
<p>"Absolute: " {move || result.get()}</p>
|
2023-06-12 11:37:20 +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(), || {
|
|
|
|
view! { <Demo /> }
|
2023-06-12 11:37:20 +01:00
|
|
|
})
|
|
|
|
}
|