2021-07-02 05:30:52 +00:00
|
|
|
use dioxus::prelude::*;
|
|
|
|
fn main() {}
|
|
|
|
|
2022-01-02 23:35:38 +00:00
|
|
|
pub fn Example(cx: Scope) -> Element {
|
2021-07-02 05:30:52 +00:00
|
|
|
cx.render(rsx! {
|
|
|
|
div {
|
|
|
|
|
|
|
|
}
|
|
|
|
})
|
2022-01-02 23:35:38 +00:00
|
|
|
}
|
2021-07-16 20:11:25 +00:00
|
|
|
|
|
|
|
// A controlled component:
|
2022-01-02 23:35:38 +00:00
|
|
|
pub fn ControlledSelect(cx: Scope) -> Element {
|
2021-12-15 20:56:53 +00:00
|
|
|
let value = use_state(&cx, || String::from("Grapefruit"));
|
2021-07-16 20:11:25 +00:00
|
|
|
cx.render(rsx! {
|
|
|
|
select { value: "{value}", onchange: move |evt| value.set(evt.value()),
|
|
|
|
option { value: "Grapefruit", "Grapefruit"}
|
|
|
|
option { value: "Lime", "Lime"}
|
|
|
|
option { value: "Coconut", "Coconut"}
|
|
|
|
option { value: "Mango", "Mango"}
|
|
|
|
}
|
|
|
|
})
|
2022-01-02 23:35:38 +00:00
|
|
|
}
|
2021-07-16 20:11:25 +00:00
|
|
|
|
|
|
|
// TODO - how do uncontrolled things work?
|
2022-01-02 23:35:38 +00:00
|
|
|
pub fn UncontrolledSelect(cx: Scope) -> Element {
|
2021-12-15 20:56:53 +00:00
|
|
|
let value = use_state(&cx, || String::new());
|
2021-07-16 20:11:25 +00:00
|
|
|
|
|
|
|
cx.render(rsx! {
|
|
|
|
select {
|
|
|
|
option { value: "Grapefruit", "Grapefruit"}
|
|
|
|
option { value: "Lime", "Lime"}
|
|
|
|
option { value: "Coconut", "Coconut"}
|
|
|
|
option { value: "Mango", "Mango"}
|
|
|
|
}
|
|
|
|
})
|
2022-01-02 23:35:38 +00:00
|
|
|
}
|