StygmatesandEvan Almloff
1b977fdce9
* fix a few new clippy lints * Add query segment example * Add trait documentation * Change core package to root package The core package contains the virtual dom implementation ([here](https://github.com/DioxusLabs/dioxus/tree/master/packages/core)). Root package might be a more clear way to refer to the main directory --------- Co-authored-by: Evan Almloff <evanalmloff@gmail.com>
Dioxus Router
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.
#![allow(non_snake_case)]
use dioxus::prelude::*;
use dioxus_router::prelude::*;
use std::str::FromStr;
#[rustfmt::skip]
#[derive(Clone, Debug, PartialEq, Routable)]
enum Route {
#[nest("/blog")]
#[layout(Blog)]
#[route("/")]
BlogList {},
#[route("/:blog_id")]
BlogPost { blog_id: usize },
#[end_layout]
#[end_nest]
#[route("/")]
Index {},
}
fn App(cx: Scope) -> Element {
render! {
Router::<Route> { }
}
}
#[inline_props]
fn Index(cx: Scope) -> Element {
render! {
h1 { "Index" }
Link {
to: Route::BlogList {},
"Go to the blog"
}
}
}
#[inline_props]
fn Blog(cx: Scope) -> Element {
render! {
h1 { "Blog" }
Outlet::<Route> { }
}
}
#[inline_props]
fn BlogList(cx: Scope) -> Element {
render! {
h2 { "List of blog posts" }
Link {
to: Route::BlogPost { blog_id: 0 },
"Blog post 1"
}
Link {
to: Route::BlogPost { blog_id: 1 },
"Blog post 2"
}
}
}
#[inline_props]
fn BlogPost(cx: Scope, blog_id: usize) -> 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.