dioxus/packages/router
2023-05-23 11:24:31 -05:00
..
examples Merge branch 'upstream' into router-typesafe 2023-05-23 11:24:31 -05:00
src update web history 2023-05-23 11:22:57 -05:00
tests actually make clippy happy 2023-04-12 20:19:01 +02:00
.gitignore chore: move tests out of core and into the top level crate 2022-03-02 22:48:22 -05:00
Cargo.toml update web history 2023-05-23 11:22:57 -05:00
CHANGELOG.md feat: add changelogs 2022-01-29 10:17:14 -05:00
Makefile.toml improve Makefile tests 2022-02-04 17:18:31 +01:00
README.md merge upstream changes 2023-04-11 19:21:48 +02:00
webdriver.json fix some newlines 2022-02-03 09:28:06 +01:00

Dioxus Router

Crates.io MIT licensed Build Status Discord chat

Website | Guides | API Docs | Chat

Overview

Dioxus Router is a first-party Router for all your Dioxus Apps. It provides an interface similar to React Router, but takes advantage of types for more expressiveness.

use dioxus::prelude::*;
use dioxus_router::prelude::*;

fn App(cx: Scope) -> Element {
    use_router(
        &cx,
        &|| Default::default(),
        &|| Segment::content(comp(Index)).fixed(
            "blog",
            Route::content(comp(Blog)).nested(
                Segment::content(comp(BlogList))
                    .catch_all((comp(BlogPost), BlogPost))
            )
        )
    );

    render! {
        Outlet { }
    }
}

fn Index(cx: Scope) -> Element {
    render! {
        h1 { "Index" }
        Link {
            target: "/blog",
            "Go to the blog"
        }
    }
}

fn Blog(cx: Scope) -> Element {
    render! {
        h1 { "Blog" }
        Outlet { }
    }
}

fn BlogList(cx: Scope) -> Element {
    render! {
        h2 { "List of blog posts" }
        Link {
            target: "/blog/1",
            "Blog post 1"
        }
        Link {
            target: "/blog/1",
            "Blog post 2"
        }
    }
}

fn BlogPost(cx: Scope) -> Element {
    render! {
        h2 { "Blog Post" }
    }
}

You need to enable the right features for the platform you're targeting since these are not determined automatically!

Contributing

  • Report issues on our issue tracker.
  • Join the discord and ask questions!

License

This project is licensed under the MIT license.

Unless you explicitly state otherwise, any contribution intentionally submitted for inclusion in Dioxus by you shall be licensed as MIT without any additional terms or conditions.