diff --git a/smart-house-web/frontend/src/main.rs b/smart-house-web/frontend/src/main.rs index da7fc9a..d7c5702 100644 --- a/smart-house-web/frontend/src/main.rs +++ b/smart-house-web/frontend/src/main.rs @@ -3,83 +3,47 @@ use leptos::prelude::*; #[component] fn App() -> impl IntoView { - let (value, set_value) = signal(0); - let is_odd = move || value.get() & 1 == 1; - let odd_text = move || if is_odd() { Some("How odd!") } else { None }; + let (value, set_value) = signal(Ok(0)); view! { -

"Control Flow"

- - // Simple UI to update and show a value - -

"Value is: " {value}

- -
- -

"Option"

- // For any `T` that implements `IntoView`, - // so does `Option` - -

{odd_text}

- // This means you can use `Option` methods on it -

{move || odd_text().map(|text| text.len())}

- -

"Conditional Logic"

- // You can do dynamic conditional if-then-else - // logic in several ways - // - // a. An "if" expression in a function - // This will simply re-render every time the value - // changes, which makes it good for lightweight UI -

- {move || if is_odd() { - "Odd" - } else { - "Even" - }} -

- - // b. Toggling some kind of class - // This is smart for an element that's going to - // toggled often, because it doesn't destroy - // it in between states - // (you can find the `hidden` class in `index.html`) -

"Appears if even."

- - // c. The component - // This only renders the fallback and the child - // once, lazily, and toggles between them when - // needed. This makes it more efficient in many cases - // than a {move || if ...} block - "Even steven"

} - > -

"Oddment"

-
- - // d. Because `bool::then()` converts a `bool` to - // `Option`, you can use it to create a show/hide toggled - {move || is_odd().then(|| view! {

"Oddity!"

})} - -

"Converting between Types"

- // e. Note: if branches return different types, - // you can convert between them with - // `.into_any()` or using the `Either` enums - // (`Either`, `EitherOf3`, `EitherOf4`, etc.) - {move || match is_odd() { - true if value.get() == 1 => { - //
 returns HtmlElement
-                view! { 
"One"
}.into_any() - }, - false if value.get() == 2 => { - //

returns HtmlElement

- // so we convert into a more generic type - view! {

"Two"

}.into_any() - } - _ => view! { }.into_any() - }} +

"Error Handling"

+ } }