mirror of
https://github.com/DioxusLabs/dioxus
synced 2024-11-10 06:34:20 +00:00
fix: some examples
This commit is contained in:
parent
f98c3f161f
commit
35b22923b2
7 changed files with 63 additions and 44 deletions
|
@ -12,7 +12,7 @@ fn main() {
|
|||
fn app(cx: Scope) -> Element {
|
||||
cx.render(rsx!(
|
||||
div {
|
||||
h1 { "drag an file here" }
|
||||
h1 { "drag a file here and check your console" }
|
||||
}
|
||||
))
|
||||
}
|
||||
|
|
|
@ -104,7 +104,6 @@ fn app(cx: Scope) -> Element {
|
|||
|
||||
// elements with driven values will preventdefault automatically.
|
||||
// you can disable this override with preventdefault: false
|
||||
|
||||
div {
|
||||
input {
|
||||
id: "pdf",
|
||||
|
@ -121,8 +120,6 @@ fn app(cx: Scope) -> Element {
|
|||
}
|
||||
}
|
||||
|
||||
|
||||
|
||||
FIELDS.iter().map(|(field, value)| rsx!(
|
||||
div {
|
||||
input {
|
||||
|
|
|
@ -10,7 +10,7 @@ fn app(cx: Scope) -> Element {
|
|||
p {
|
||||
a {
|
||||
href: "http://dioxuslabs.com/",
|
||||
"default link"
|
||||
"Default link - links outside of your app"
|
||||
}
|
||||
}
|
||||
p {
|
||||
|
@ -20,7 +20,19 @@ fn app(cx: Scope) -> Element {
|
|||
onclick: |_| {
|
||||
println!("Hello Dioxus");
|
||||
},
|
||||
"custom event link",
|
||||
"Custom event link - links inside of your app",
|
||||
}
|
||||
}
|
||||
}
|
||||
div {
|
||||
Router {
|
||||
Route { to: "/", h1 { "Home" } },
|
||||
Route { to: "/settings", h1 { "settings" } },
|
||||
|
||||
p { "----"}
|
||||
ul {
|
||||
Link { to: "/", li { "Router link to home" } },
|
||||
Link { to: "/settings", li { "Router link to settings" } },
|
||||
}
|
||||
}
|
||||
}
|
||||
|
|
|
@ -14,6 +14,8 @@ fn app(cx: Scope) -> Element {
|
|||
cx.render(rsx! {
|
||||
div {
|
||||
onclick: move |_| println!("clicked! top"),
|
||||
"- div"
|
||||
|
||||
button {
|
||||
onclick: move |_| println!("clicked! bottom propoate"),
|
||||
"Propogate"
|
||||
|
@ -26,7 +28,7 @@ fn app(cx: Scope) -> Element {
|
|||
"Dont propogate"
|
||||
}
|
||||
button {
|
||||
"Does not handle clicks"
|
||||
"Does not handle clicks - only propogate"
|
||||
}
|
||||
}
|
||||
})
|
||||
|
|
|
@ -13,18 +13,17 @@ fn app(cx: Scope) -> Element {
|
|||
Router {
|
||||
ul {
|
||||
Link { to: "/", li { "Go home!" } }
|
||||
Link { to: "users", li { "List all users" } }
|
||||
Link { to: "blog", li { "Blog posts" } }
|
||||
Link { to: "/users", li { "List all users" } }
|
||||
Link { to: "/blog", li { "Blog posts" } }
|
||||
|
||||
Link { to: "/users/bill", li { "List all users" } }
|
||||
Link { to: "/blog/5", li { "Blog post 5" } }
|
||||
}
|
||||
Route { to: "/", "Home" }
|
||||
Route { to: "users",
|
||||
Route { to: "/", "User list" }
|
||||
Route { to: ":name", User {} }
|
||||
}
|
||||
Route { to: "blog"
|
||||
Route { to: "/", "Blog list" }
|
||||
Route { to: ":post", BlogPost {} }
|
||||
}
|
||||
Route { to: "/users", "User list" }
|
||||
Route { to: "/users/:name", User {} }
|
||||
Route { to: "/blog", "Blog list" }
|
||||
Route { to: "/blog/:post", BlogPost {} }
|
||||
Route { to: "", "Err 404 Route Not Found" }
|
||||
}
|
||||
})
|
||||
|
|
|
@ -118,34 +118,43 @@ pub fn todo_entry<'a>(cx: Scope<'a, TodoEntryProps<'a>>) -> Element {
|
|||
let completed = if todo.checked { "completed" } else { "" };
|
||||
let editing = if **is_editing { "editing" } else { "" };
|
||||
|
||||
rsx!(cx, li {
|
||||
class: "{completed} {editing}",
|
||||
div { class: "view",
|
||||
input { class: "toggle", r#type: "checkbox", id: "cbg-{todo.id}", checked: "{todo.checked}",
|
||||
onchange: move |evt| {
|
||||
cx.props.todos.make_mut()[&cx.props.id].checked = evt.value.parse().unwrap();
|
||||
cx.render(rsx!{
|
||||
li {
|
||||
class: "{completed} {editing}",
|
||||
div { class: "view",
|
||||
|
||||
input {
|
||||
class: "toggle",
|
||||
r#type: "checkbox",
|
||||
id: "cbg-{todo.id}",
|
||||
checked: "{todo.checked}",
|
||||
oninput: move |evt| {
|
||||
cx.props.todos.make_mut()[&cx.props.id].checked = evt.value.parse().unwrap();
|
||||
}
|
||||
}
|
||||
|
||||
label {
|
||||
r#for: "cbg-{todo.id}",
|
||||
onclick: move |_| is_editing.set(true),
|
||||
prevent_default: "onclick",
|
||||
"{todo.contents}"
|
||||
}
|
||||
}
|
||||
label {
|
||||
r#for: "cbg-{todo.id}",
|
||||
onclick: move |_| is_editing.set(true),
|
||||
"{todo.contents}"
|
||||
}
|
||||
is_editing.then(|| rsx!{
|
||||
input {
|
||||
class: "edit",
|
||||
value: "{todo.contents}",
|
||||
oninput: move |evt| cx.props.todos.make_mut()[&cx.props.id].contents = evt.value.clone(),
|
||||
autofocus: "true",
|
||||
onfocusout: move |_| is_editing.set(false),
|
||||
onkeydown: move |evt| {
|
||||
match evt.key.as_str() {
|
||||
"Enter" | "Escape" | "Tab" => is_editing.set(false),
|
||||
_ => {}
|
||||
}
|
||||
},
|
||||
}
|
||||
})
|
||||
}
|
||||
is_editing.then(|| rsx!{
|
||||
input {
|
||||
class: "edit",
|
||||
value: "{todo.contents}",
|
||||
oninput: move |evt| cx.props.todos.make_mut()[&cx.props.id].contents = evt.value.clone(),
|
||||
autofocus: "true",
|
||||
onfocusout: move |_| is_editing.set(false),
|
||||
onkeydown: move |evt| {
|
||||
match evt.key.as_str() {
|
||||
"Enter" | "Escape" | "Tab" => is_editing.set(false),
|
||||
_ => {}
|
||||
}
|
||||
},
|
||||
}
|
||||
})
|
||||
})
|
||||
}
|
||||
|
|
|
@ -33,7 +33,7 @@ pub mod prelude {
|
|||
pub use dioxus_html as dioxus_elements;
|
||||
|
||||
#[cfg(feature = "router")]
|
||||
pub use dioxus_router::{use_route, use_router, Link, Redirect, Router, UseRoute};
|
||||
pub use dioxus_router::{use_route, use_router, Link, Redirect, Router, UseRoute, Route};
|
||||
|
||||
#[cfg(feature = "fermi")]
|
||||
pub use fermi::{use_atom_ref, use_init_atom_root, use_read, use_set, Atom, AtomRef};
|
||||
|
|
Loading…
Reference in a new issue