mirror of
https://github.com/DioxusLabs/dioxus
synced 2024-09-20 14:21:58 +00:00
update example to showcase hot reloading
This commit is contained in:
parent
3c7db0631b
commit
7acc6a553f
1 changed files with 50 additions and 6 deletions
|
@ -7,6 +7,7 @@ fn main() {
|
|||
|
||||
fn app(cx: Scope) -> Element {
|
||||
let count = use_state(&cx, || 170);
|
||||
let rsx_code = use_state(&cx, || None);
|
||||
|
||||
use_future(&cx, (), move |_| {
|
||||
let mut count = count.clone();
|
||||
|
@ -20,23 +21,66 @@ fn app(cx: Scope) -> Element {
|
|||
|
||||
cx.render(rsx! {
|
||||
div {
|
||||
width: format!("{}px", count),
|
||||
background_color: "#999999",
|
||||
width: "100%",
|
||||
height: "100%",
|
||||
onclick: move |_| {
|
||||
count.modify(|count| *count + 10);
|
||||
},
|
||||
p{
|
||||
|
||||
div {
|
||||
display: "flex",
|
||||
flex_direction: "row",
|
||||
width: "100%",
|
||||
height: "50%",
|
||||
textarea {
|
||||
width: "90%",
|
||||
value: {
|
||||
if rsx_code.get().is_none() {
|
||||
let rsx_text_index: RsxTextIndex = cx.consume_context().unwrap();
|
||||
let read = rsx_text_index.read();
|
||||
rsx_code.set(Some(read.get(&line_num).unwrap().clone()));
|
||||
}
|
||||
(*rsx_code.current()).clone().unwrap()
|
||||
},
|
||||
oninput: move |evt| {
|
||||
rsx_code.set(Some(evt.value.clone()));
|
||||
},
|
||||
}
|
||||
|
||||
button {
|
||||
height: "100%",
|
||||
width: "10%",
|
||||
onclick: move |_|{
|
||||
if let Some(code) = rsx_code.get(){
|
||||
let rsx_text_index: RsxTextIndex = cx.consume_context().unwrap();
|
||||
rsx_text_index.insert(line_num.clone(), code.clone());
|
||||
}
|
||||
},
|
||||
"submit"
|
||||
}
|
||||
}
|
||||
|
||||
p {
|
||||
"High-Five counter: {count}",
|
||||
}
|
||||
Comp{
|
||||
|
||||
div {
|
||||
width: format!("{}px", count),
|
||||
height: "10px",
|
||||
background_color: "red",
|
||||
}
|
||||
|
||||
Comp {
|
||||
color: "#083289"
|
||||
}
|
||||
Comp{
|
||||
|
||||
Comp {
|
||||
color: "green"
|
||||
}
|
||||
|
||||
{
|
||||
(0..10).map(|i| {
|
||||
cx.render(rsx!{p{"{i}"}})
|
||||
cx.render(rsx!{p {"{i}"}})
|
||||
})
|
||||
}
|
||||
}
|
||||
|
|
Loading…
Reference in a new issue