mirror of
https://github.com/DioxusLabs/dioxus
synced 2024-12-24 03:23:11 +00:00
72 lines
1.5 KiB
Rust
72 lines
1.5 KiB
Rust
#![allow(non_snake_case)]
|
|
use dioxus::prelude::*;
|
|
use dioxus_router::prelude::*;
|
|
|
|
// ANCHOR: router
|
|
#[derive(Routable, Clone)]
|
|
#[rustfmt::skip]
|
|
enum Route {
|
|
// All routes under the NavBar layout will be rendered inside of the NavBar Outlet
|
|
#[layout(NavBar)]
|
|
#[route("/")]
|
|
Home {},
|
|
#[end_layout]
|
|
#[route("/:..route")]
|
|
PageNotFound { route: Vec<String> },
|
|
}
|
|
// ANCHOR_END: router
|
|
|
|
// ANCHOR: nav
|
|
#[inline_props]
|
|
fn NavBar(cx: Scope) -> Element {
|
|
render! {
|
|
nav {
|
|
ul {
|
|
li {
|
|
Link {
|
|
// The Link component will navigate to the route specified
|
|
// in the target prop which is checked to exist at compile time
|
|
to: Route::Home {},
|
|
"Home"
|
|
}
|
|
}
|
|
}
|
|
}
|
|
Outlet {}
|
|
}
|
|
}
|
|
// ANCHOR_END: nav
|
|
|
|
// ANCHOR: app
|
|
#[inline_props]
|
|
fn App(cx: Scope) -> Element {
|
|
render! {
|
|
Router {}
|
|
}
|
|
}
|
|
// ANCHOR_END: app
|
|
|
|
// ANCHOR: home
|
|
#[inline_props]
|
|
fn Home(cx: Scope) -> Element {
|
|
render! {
|
|
h1 { "Welcome to the Dioxus Blog!" }
|
|
}
|
|
}
|
|
// ANCHOR_END: home
|
|
|
|
// ANCHOR: fallback
|
|
#[inline_props]
|
|
fn PageNotFound(cx: Scope, 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:?}"
|
|
}
|
|
}
|
|
}
|
|
// ANCHOR_END: fallback
|
|
|
|
fn main() {}
|