This change switches back to the original `ctx<props>` syntax for commponents. This lets lifetime elision to remove the need to match exactly which lifetime (props or ctx) gets carried to the output. As such, `Props` is currently required to be static. It *is* possible to loosen this restriction, and will be done in the future, though only through adding metadata about the props through the Props derive macro. Implementing the IS_STATIC trait is unsafe, so the derive macro will do it through some heuristics. For now, this unlocks sharing vnodes from parents to children, enabling pass-thru components, fragments, portals, etc.
43 lines
1.0 KiB
Rust
43 lines
1.0 KiB
Rust
//! Dioxus Router
|
|
//! -------------
|
|
//!
|
|
//! This exmaple showcases the Dioxus Router hook. This hook makes it possible to using the browser's navigation API to
|
|
//! display different content based on the Page's URL. The hook provides a configuration object that calls various
|
|
//! specified callbacks whenever the page URL changes. Using this hook should feel like building a "URL directory", similar
|
|
//! to how Tide handles paths.
|
|
|
|
use dioxus::prelude::*;
|
|
|
|
fn main() {
|
|
diouxs_webview::launch(App).run().await
|
|
}
|
|
|
|
fn App(ctx: Context<()>) -> VNode {
|
|
let router = use_router(&ctx, |router| {
|
|
//
|
|
router.get("/dogs/:dogId/").render(|ctx, request| {
|
|
rsx! {
|
|
div {
|
|
|
|
}
|
|
}
|
|
});
|
|
|
|
router.get("/cats/:catId/").render(|ctx, request| {
|
|
rsx! {
|
|
div {
|
|
|
|
}
|
|
}
|
|
});
|
|
});
|
|
|
|
ctx.render(rsx! {
|
|
div {
|
|
a { href="/dogs/"}
|
|
a { href="/cats/"}
|
|
{router.render()}
|
|
}
|
|
})
|
|
}
|