impl ComponentFunction for Routes

This commit is contained in:
Evan Almloff committed 2024-01-16 09:40:17 -06:00
1 parent 7e4d2debe0
commit d2cdcc602b
9 files changed
+154 -106

No files matched your search

+9 -11
View File
@@ -5,17 +5,15 @@ use dioxus_router::prelude::*;
fn main() {
env_logger::init();
LaunchBuilder::new(|| {
render! { Router::<Route> {} }
})
.cfg(
Config::new().with_window(
WindowBuilder::new()
.with_inner_size(LogicalSize::new(600, 1000))
.with_resizable(false),
),
)
.launch()
LaunchBuilder::new(Route::Home {})
.cfg(
Config::new().with_window(
WindowBuilder::new()
.with_inner_size(LogicalSize::new(600, 1000))
.with_resizable(false),
),
)
.launch()
}
#[derive(Routable, Clone)]
+11 -11
View File
@@ -9,21 +9,17 @@ fn main() {
fn App() -> Element {
rsx! (
div {
p {
a { href: "http://dioxuslabs.com/", "Default link - links outside of your app" }
}
p { a { href: "http://dioxuslabs.com/", "Default link - links outside of your app" } }
p {
a {
href: "http://dioxuslabs.com/",
prevent_default: "onclick",
onclick: |_| println!("Hello Dioxus"),
"Custom event link - links inside of your app",
"Custom event link - links inside of your app"
}
}
}
div {
Router::<Route> {}
}
div { Router::<Route> {} }
)
}
@@ -42,8 +38,12 @@ fn Header() -> Element {
render! {
h1 { "Your app here" }
ul {
li { Link { to: Route::Home {}, "home" } }
li { Link { to: Route::Settings {}, "settings" } }
li {
Link { to: Route::Home {}, "home" }
}
li {
Link { to: Route::Settings {}, "settings" }
}
}
Outlet::<Route> {}
}
@@ -51,10 +51,10 @@ fn Header() -> Element {
#[component]
fn Home() -> Element {
render!(h1 { "Home" })
render!( h1 { "Home" } )
}
#[component]
fn Settings() -> Element {
render!(h1 { "Settings" })
render!( h1 { "Settings" } )
}
+16 -25
View File
@@ -2,10 +2,7 @@ use dioxus::prelude::*;
use dioxus_router::prelude::*;
fn main() {
#[cfg(target_arch = "wasm32")]
dioxus_web::launch(App);
#[cfg(not(target_arch = "wasm32"))]
launch(App);
launch(Route::Home {});
}
// ANCHOR: router
@@ -35,20 +32,17 @@ enum Route {
}
// ANCHOR_END: router
#[component]
fn App() -> Element {
render! {
Router::<Route> {}
}
}
#[component]
fn NavBar() -> Element {
render! {
nav {
ul {
li { Link { to: Route::Home {}, "Home" } }
li { Link { to: Route::BlogList {}, "Blog" } }
li {
Link { to: Route::Home {}, "Home" }
}
li {
Link { to: Route::BlogList {}, "Blog" }
}
}
}
Outlet::<Route> {}
@@ -57,9 +51,7 @@ fn NavBar() -> Element {
#[component]
fn Home() -> Element {
render! {
h1 { "Welcome to the Dioxus Blog!" }
}
render! { h1 { "Welcome to the Dioxus Blog!" } }
}
#[component]
@@ -77,13 +69,17 @@ fn BlogList() -> Element {
ul {
li {
Link {
to: Route::BlogPost { name: "Blog post 1".into() },
to: Route::BlogPost {
name: "Blog post 1".into(),
},
"Read the first blog post"
}
}
li {
Link {
to: Route::BlogPost { name: "Blog post 2".into() },
to: Route::BlogPost {
name: "Blog post 2".into(),
},
"Read the second blog post"
}
}
@@ -93,9 +89,7 @@ fn BlogList() -> Element {
#[component]
fn BlogPost(name: String) -> Element {
render! {
h2 { "Blog Post: {name}"}
}
render! { h2 { "Blog Post: {name}" } }
}
#[component]
@@ -103,9 +97,6 @@ fn PageNotFound(route: Vec<String>) -> Element {
render! {
h1 { "Page not found" }
p { "We are terribly sorry, but the page you requested doesn't exist." }
pre {
color: "red",
"log:\nattemped to navigate to: {route:?}"
}
pre { color: "red", "log:\nattemped to navigate to: {route:?}" }
}
}
+32 -14
View File
@@ -9,14 +9,7 @@ fn main() {
.with_module_level("dioxus", log::LevelFilter::Trace)
.init()
.unwrap();
launch(App);
}
#[component]
fn App() -> Element {
render! {
Router::<Route> {}
}
launch(Route::Home {});
}
#[derive(Routable, Clone)]
@@ -42,11 +35,36 @@ fn NavBar() -> Element {
render! {
h1 { "Your app here" }
ul {
li { Link { to: Route::Home {}, "home" } }
li { Link { to: Route::BlogList {}, "blog" } }
li { Link { to: Route::BlogPost { post: "tim".into() }, "tims' blog" } }
li { Link { to: Route::BlogPost { post: "bill".into() }, "bills' blog" } }
li { Link { to: Route::BlogPost { post: "james".into() }, "james amazing' blog" } }
li {
Link { to: Route::Home {}, "home" }
}
li {
Link { to: Route::BlogList {}, "blog" }
}
li {
Link {
to: Route::BlogPost {
post: "tim".into(),
},
"tims' blog"
}
}
li {
Link {
to: Route::BlogPost {
post: "bill".into(),
},
"bills' blog"
}
}
li {
Link {
to: Route::BlogPost {
post: "james".into(),
},
"james amazing' blog"
}
}
}
Outlet::<Route> {}
}
@@ -70,7 +88,7 @@ fn BlogPost(post: String) -> Element {
render! {
div {
h3 { "blog post: {post}" }
h3 { "blog post: {post}" }
Link { to: Route::BlogList {}, "back to blog list" }
}
}
+22 -4
View File
@@ -29,14 +29,32 @@ fn Blog(id: String) -> Element {
fn Nav() -> Element {
render! {
nav {
li { Link { to: Route::Homepage { }, "Go home" } }
li { Link { to: Route::Blog { id: "Brownies".to_string() }, "Learn Brownies" } }
li { Link { to: Route::Blog { id: "Cookies".to_string() }, "Learn Cookies" } }
li {
Link { to: Route::Homepage {}, "Go home" }
}
li {
Link {
to: Route::Blog {
id: "Brownies".to_string(),
},
"Learn Brownies"
}
}
li {
Link {
to: Route::Blog {
id: "Cookies".to_string(),
},
"Learn Cookies"
}
}
}
div { Outlet::<Route> {} }
}
}
fn main() {
launch(|| render!(Router::<Route> {}));
launch(Route::Blog {
id: "hello".to_string(),
});
}