2024-05-07 12:41:44 +01:00
|
|
|
use leptos::prelude::*;
|
2023-07-14 05:48:37 +01:00
|
|
|
use leptos_use::docs::demo_or_body;
|
|
|
|
use leptos_use::{use_intl_number_format, NumberStyle, UseIntlNumberFormatOptions};
|
|
|
|
|
|
|
|
#[component]
|
2023-07-27 18:06:36 +01:00
|
|
|
fn Demo() -> impl IntoView {
|
2024-05-07 12:41:44 +01:00
|
|
|
let (number, set_number) = signal(123456.78);
|
2023-07-14 05:48:37 +01:00
|
|
|
|
|
|
|
let de_nf = use_intl_number_format(
|
|
|
|
UseIntlNumberFormatOptions::default()
|
|
|
|
.locale("de-DE")
|
|
|
|
.style(NumberStyle::Currency)
|
|
|
|
.currency("EUR"),
|
|
|
|
);
|
2023-07-27 18:06:36 +01:00
|
|
|
let de_num = de_nf.format::<f64>(number);
|
2023-07-14 05:48:37 +01:00
|
|
|
|
|
|
|
let ja_nf = use_intl_number_format(
|
|
|
|
UseIntlNumberFormatOptions::default()
|
|
|
|
.locale("ja-JP")
|
|
|
|
.style(NumberStyle::Currency)
|
|
|
|
.currency("JPY"),
|
|
|
|
);
|
2023-07-27 18:06:36 +01:00
|
|
|
let ja_num = ja_nf.format::<f64>(number);
|
2023-07-14 05:48:37 +01:00
|
|
|
|
|
|
|
let in_nf = use_intl_number_format(
|
|
|
|
UseIntlNumberFormatOptions::default()
|
|
|
|
.locale("en-IN")
|
|
|
|
.maximum_significant_digits(3),
|
|
|
|
);
|
2023-07-27 18:06:36 +01:00
|
|
|
let in_num = in_nf.format::<f64>(number);
|
2023-07-14 05:48:37 +01:00
|
|
|
|
2023-07-27 19:48:21 +01:00
|
|
|
view! {
|
|
|
|
<input
|
2023-07-14 05:48:37 +01:00
|
|
|
class="block"
|
|
|
|
prop:value=number
|
|
|
|
on:input=move |e| set_number(event_target_value(&e).parse().unwrap())
|
|
|
|
type="range"
|
|
|
|
min="-1000000"
|
|
|
|
max="1000000"
|
|
|
|
step="0.01"
|
|
|
|
/>
|
2023-07-27 19:48:21 +01:00
|
|
|
<p>"Number: " {number}</p>
|
|
|
|
<p>"German currency (EUR): " {de_num}</p>
|
|
|
|
<p>"Japanese currency (JPY): " {ja_num}</p>
|
|
|
|
<p>"Indian 3 max significant digits: " {in_num}</p>
|
2023-07-14 05:48:37 +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-14 05:48:37 +01:00
|
|
|
})
|
|
|
|
}
|