Intro to Dioxus 0.7

Step 5 / 6

Routing

Dioxus 0.7 has a first-class router. Define your routes as an enum, derive Routable, and nest layouts with Outlet.

src/main.rs

#[derive(Debug, Clone, Routable, PartialEq)]
enum Route {
    #[layout(Navbar)]
        #[route("/")]
        Home {},
        #[route("/about")]
        About {},
}

fn main() {
    dioxus::launch(App);
}

#[component]
fn App() -> Element {
    rsx! { Router::<Route> {} }
}

Step 5 / 6

◀ Prev Next ▶