mirror of
https://github.com/DioxusLabs/dioxus
synced 2024-11-23 20:53:06 +00:00
93 lines
2.6 KiB
Rust
93 lines
2.6 KiB
Rust
use dioxus::prelude::*;
|
|
use dioxus_tui::Config;
|
|
|
|
fn main() {
|
|
dioxus_tui::launch_cfg(app, Config::new());
|
|
}
|
|
|
|
fn app() -> Element {
|
|
let bg_green = use_signal(|| false);
|
|
|
|
let color = if *bg_green.get() { "green" } else { "red" };
|
|
rsx! {
|
|
div{
|
|
width: "100%",
|
|
background_color: "{color}",
|
|
flex_direction: "column",
|
|
align_items: "center",
|
|
justify_content: "center",
|
|
|
|
input {
|
|
oninput: |data| if &data.value()== "good"{
|
|
bg_green.set(true);
|
|
} else{
|
|
bg_green.set(false);
|
|
},
|
|
r#type: "checkbox",
|
|
value: "good",
|
|
width: "50%",
|
|
height: "10%",
|
|
checked: "true",
|
|
}
|
|
input {
|
|
oninput: |data| if &data.value()== "hello world"{
|
|
bg_green.set(true);
|
|
} else{
|
|
bg_green.set(false);
|
|
},
|
|
width: "50%",
|
|
height: "10%",
|
|
maxlength: "11",
|
|
}
|
|
input {
|
|
oninput: |data| {
|
|
if (data.value().parse::<f32>().unwrap() - 40.0).abs() < 5.0 {
|
|
bg_green.set(true);
|
|
} else{
|
|
bg_green.set(false);
|
|
}
|
|
},
|
|
r#type: "range",
|
|
width: "50%",
|
|
height: "10%",
|
|
min: "20",
|
|
max: "80",
|
|
}
|
|
input {
|
|
oninput: |data| {
|
|
if data.value()== "10"{
|
|
bg_green.set(true);
|
|
} else{
|
|
bg_green.set(false);
|
|
}
|
|
},
|
|
r#type: "number",
|
|
width: "50%",
|
|
height: "10%",
|
|
maxlength: "4",
|
|
}
|
|
input {
|
|
oninput: |data| {
|
|
if data.value()== "hello world"{
|
|
bg_green.set(true);
|
|
} else{
|
|
bg_green.set(false);
|
|
}
|
|
},
|
|
r#type: "password",
|
|
width: "50%",
|
|
height: "10%",
|
|
maxlength: "11",
|
|
}
|
|
input {
|
|
oninput: |_| {
|
|
bg_green.set(true)
|
|
},
|
|
r#type: "button",
|
|
value: "green",
|
|
width: "50%",
|
|
height: "10%",
|
|
}
|
|
}
|
|
}
|
|
}
|