From a947ce22154a0b4b79c7ad5361bb41b57af2f290 Mon Sep 17 00:00:00 2001 From: Adrian Wannenmacher Date: Fri, 16 Dec 2022 10:41:44 +0100 Subject: [PATCH] update router book --- docs/router/src/example/building-a-nest.md | 34 +++++----- docs/router/src/example/example.rs | 30 ++++----- docs/router/src/example/first-route.md | 16 ++--- docs/router/src/example/navigation-targets.md | 12 ++-- docs/router/src/features/failures/external.md | 12 ++-- docs/router/src/features/failures/named.md | 10 +-- docs/router/src/features/history-buttons.md | 4 +- docs/router/src/features/history-providers.md | 6 +- docs/router/src/features/index.md | 6 +- .../src/features/navigation/external.md | 6 +- docs/router/src/features/navigation/index.md | 10 +-- docs/router/src/features/navigation/name.md | 16 ++--- .../src/features/navigation/programmatic.md | 4 +- docs/router/src/features/outlets.md | 62 +++++++++---------- docs/router/src/features/query.md | 10 +-- docs/router/src/features/routes/catch_all.md | 20 +++--- docs/router/src/features/routes/fallback.md | 28 ++++----- docs/router/src/features/routes/index.md | 26 ++++---- docs/router/src/features/routes/matching.md | 28 ++++----- .../features/routes/multiple-and-redirect.md | 10 +-- docs/router/src/features/routes/nested.md | 42 ++++++------- .../src/features/routing-update-callback.md | 2 +- .../router/src/features/sitemap-generation.md | 30 ++++----- 23 files changed, 212 insertions(+), 212 deletions(-) diff --git a/docs/router/src/example/building-a-nest.md b/docs/router/src/example/building-a-nest.md index 6d9cbba57..e2a646c58 100644 --- a/docs/router/src/example/building-a-nest.md +++ b/docs/router/src/example/building-a-nest.md @@ -17,11 +17,11 @@ Let's create a new `NavBar` component: # use dioxus_router::prelude::*; # fn NavBar(cx: Scope) -> Element { - cx.render(rsx! { + render! { nav { ul { } } - }) + } } ``` @@ -40,7 +40,7 @@ more on other targets later) and an element. Let's add our links # use dioxus_router::prelude::*; # fn NavBar(cx: Scope) -> Element { - cx.render(rsx! { + render! { nav { ul { // new stuff starts here @@ -55,7 +55,7 @@ fn NavBar(cx: Scope) -> Element { // new stuff ends here } } - }) + } } ``` @@ -81,10 +81,10 @@ fn App(cx: Scope) -> Element { &|| Segment::content(comp(Home)).fallback(comp(PageNotFound)) ); - cx.render(rsx! { + render! { NavBar { } // this is new Outlet { } - }) + } } ``` Now you should see a list of links near the top of your page. Click on one and @@ -103,7 +103,7 @@ in that case. # use dioxus_router::prelude::*; # fn NavBar(cx: Scope) -> Element { - cx.render(rsx! { + render! { nav { ul { li { Link { @@ -118,7 +118,7 @@ fn NavBar(cx: Scope) -> Element { } } } } - }) + } } ``` @@ -149,10 +149,10 @@ us to add a heading that tells the user they are on the blog. # use dioxus_router::prelude::*; # fn Blog(cx: Scope) -> Element { - cx.render(rsx! { + render! { h1 { "Blog" } Outlet {} - }) + } } ``` @@ -170,7 +170,7 @@ is selected: # use dioxus_router::prelude::*; # fn BlogList(cx: Scope) -> Element { - cx.render(rsx! { + render! { h2 { "Choose a post" } ul { li { Link { @@ -182,7 +182,7 @@ fn BlogList(cx: Scope) -> Element { "Read the second blog post" } } } - }) + } } ``` @@ -199,16 +199,16 @@ parameters: struct PostId; fn BlogPost(cx: Scope) -> Element { - let route = use_route(&cx).unwrap(); + let route = use_route(cx).unwrap(); let post_id = route.parameter::(); let post = post_id .map(|id| id.to_string()) .unwrap_or(String::from("unknown")); - cx.render(rsx! { + render! { h2 { "Blog Post: {post}"} - }) + } } ``` @@ -243,10 +243,10 @@ fn App(cx: Scope) -> Element { } ); - cx.render(rsx! { + render! { NavBar { } Outlet { } - }) + } } ``` diff --git a/docs/router/src/example/example.rs b/docs/router/src/example/example.rs index dbd012dc9..d41594848 100644 --- a/docs/router/src/example/example.rs +++ b/docs/router/src/example/example.rs @@ -22,38 +22,38 @@ fn App(cx: Scope) -> Element { } ); - cx.render(rsx! { + render! { NavBar {} Outlet {} - }) + } } fn NavBar(cx: Scope) -> Element { - cx.render(rsx! { + render! { nav { ul { li { Link { target: named::(), "Home" } } li { Link { target: "/blog", "Blog" } } } } - }) + } } fn Home(cx: Scope) -> Element { - cx.render(rsx! { + render! { h1 { "Welcome to the Dioxus Blog!" } - }) + } } fn Blog(cx: Scope) -> Element { - cx.render(rsx! { + render! { h1 { "Blog" } Outlet {} - }) + } } fn BlogList(cx: Scope) -> Element { - cx.render(rsx! { + render! { h2 { "Choose a post" } ul { li { Link { @@ -65,27 +65,27 @@ fn BlogList(cx: Scope) -> Element { "Read the second blog post" } } } - }) + } } struct PostId; struct BlogPostName; fn BlogPost(cx: Scope) -> Element { - let route = use_route(&cx).unwrap(); + let route = use_route(cx).unwrap(); let post_id = route.parameter::(); let post = post_id .map(|id| id.to_string()) .unwrap_or(String::from("unknown")); - cx.render(rsx! { + render! { h2 { "Blog Post: {post}"} - }) + } } fn PageNotFound(cx: Scope) -> Element { - cx.render(rsx! { + render! { h1 { "Page not found" } p { "We are terribly sorry, but the page you requested doesn't exist." } - }) + } } diff --git a/docs/router/src/example/first-route.md b/docs/router/src/example/first-route.md index 680bc813a..9a14641c3 100644 --- a/docs/router/src/example/first-route.md +++ b/docs/router/src/example/first-route.md @@ -14,9 +14,9 @@ First we need an actual page to route to! Let's add a homepage component: # use dioxus::prelude::*; # fn Home(cx: Scope) -> Element { - cx.render(rsx! { + render! { h1 { "Welcome to the Dioxus Blog!" } - }) + } } ``` @@ -49,9 +49,9 @@ fn App(cx: Scope) -> Element { &|| Segment::content(comp(Home)) ); - cx.render(rsx! { + render! { Outlet { } - }) + } } ``` @@ -74,10 +74,10 @@ First, we create a new `PageNotFound` component. # use dioxus::prelude::*; # fn PageNotFound(cx: Scope) -> Element { - cx.render(rsx! { + render! { h1 { "Page not found" } p { "We are terribly sorry, but the page you requested doesn't exist." } - }) + } } ``` @@ -101,9 +101,9 @@ fn App(cx: Scope) -> Element { } ); - cx.render(rsx! { + render! { Outlet { } - }) + } } ``` diff --git a/docs/router/src/example/navigation-targets.md b/docs/router/src/example/navigation-targets.md index 977c890c7..f8145f463 100644 --- a/docs/router/src/example/navigation-targets.md +++ b/docs/router/src/example/navigation-targets.md @@ -25,7 +25,7 @@ If we need a link to an external page we can do it like this: # use dioxus_router::prelude::*; # fn GoToDioxus(cx: Scope) -> Element { - cx.render(rsx! { + render! { Link { target: NavigationTarget::External("https://dioxuslabs.com".into()), "Explicit ExternalTarget target" @@ -34,7 +34,7 @@ fn GoToDioxus(cx: Scope) -> Element { target: "https://dioxuslabs.com", // short form "Implicit ExternalTarget target" } - }) + } } ``` @@ -105,7 +105,7 @@ Now we can change the targets of the links in our `BlogList` component. # fn BlogPost(cx: Scope) -> Element { unimplemented!() } # fn BlogList(cx: Scope) -> Element { - cx.render(rsx! { + render! { h2 { "Choose a post" } ul { li { Link { @@ -119,7 +119,7 @@ fn BlogList(cx: Scope) -> Element { "Read the second blog post" } } } - }) + } } ``` @@ -142,14 +142,14 @@ We can change the link in our `NavBar` component to take advantage of that. # use dioxus_router::prelude::*; # fn NavBar(cx: Scope) -> Element { - cx.render(rsx! { + render! { nav { ul { li { Link { target: named::(), "Home" } } li { Link { target: "/blog", "Blog" } } } } - }) + } } ``` diff --git a/docs/router/src/features/failures/external.md b/docs/router/src/features/failures/external.md index abb557c5a..033f14278 100644 --- a/docs/router/src/features/failures/external.md +++ b/docs/router/src/features/failures/external.md @@ -35,23 +35,23 @@ You can override it by setting the `failure_external_navigation` value of the # extern crate dioxus_router; # use dioxus_router::prelude::*; fn ExternalNavigationFallback(cx: Scope) -> Element { - let route = use_route(&cx).expect("is nested within a Router component"); + let route = use_route(cx).expect("is nested within a Router component"); let url = route .parameter::() .unwrap_or_default(); - cx.render(rsx! { + render! { h1 { "External navigation failure!" } Link { target: url, "Go to external site" } - }) + } } fn App(cx: Scope) -> Element { use_router( - &cx, + cx, &|| RouterConfiguration { failure_external_navigation: comp(ExternalNavigationFallback), ..Default::default() @@ -59,9 +59,9 @@ fn App(cx: Scope) -> Element { &|| Segment::empty() ); - cx.render(rsx! { + render! { Outlet { } - }) + } } ``` diff --git a/docs/router/src/features/failures/named.md b/docs/router/src/features/failures/named.md index a19e5954c..0f2b081fe 100644 --- a/docs/router/src/features/failures/named.md +++ b/docs/router/src/features/failures/named.md @@ -37,14 +37,14 @@ You can override it by setting the `failure_named_navigation` value of the # extern crate dioxus_router; # use dioxus_router::prelude::*; fn NamedNavigationFallback(cx: Scope) -> Element { - cx.render(rsx! { + render! { h1 { "Named navigation failure!" } - }) + } } fn App(cx: Scope) -> Element { use_router( - &cx, + cx, &|| RouterConfiguration { failure_named_navigation: comp(NamedNavigationFallback), ..Default::default() @@ -52,9 +52,9 @@ fn App(cx: Scope) -> Element { &|| Segment::empty() ); - cx.render(rsx! { + render! { Outlet { } - }) + } } ``` diff --git a/docs/router/src/features/history-buttons.md b/docs/router/src/features/history-buttons.md index 968b49b0d..e86be2836 100644 --- a/docs/router/src/features/history-buttons.md +++ b/docs/router/src/features/history-buttons.md @@ -22,14 +22,14 @@ use dioxus::prelude::*; use dioxus_router::prelude::*; fn HistoryNavigation(cx: Scope) -> Element { - cx.render(rsx! { + render! { GoBackButton { "Back to the Past" } GoForwardButton { "Back to the Future" /* You see what I did there? 😉 */ } - }) + } } ``` diff --git a/docs/router/src/features/history-providers.md b/docs/router/src/features/history-providers.md index bf14413e0..eacda6342 100644 --- a/docs/router/src/features/history-providers.md +++ b/docs/router/src/features/history-providers.md @@ -24,7 +24,7 @@ use dioxus_router::{prelude::*, history::WebHashHistory}; fn App(cx: Scope) -> Element { use_router( - &cx, + cx, &|| RouterConfiguration { history: Box::new(WebHashHistory::new(true)), ..Default::default() @@ -32,9 +32,9 @@ fn App(cx: Scope) -> Element { &|| Segment::empty() ); - cx.render(rsx! { + render! { Outlet { } - }) + } } ``` diff --git a/docs/router/src/features/index.md b/docs/router/src/features/index.md index 320006987..51e6260e1 100644 --- a/docs/router/src/features/index.md +++ b/docs/router/src/features/index.md @@ -24,7 +24,7 @@ fn App(cx: Scope) -> Element { // Here we add the router. All components inside `App` have access to its // functionality. let routes = use_router( - &cx, + cx, // The router can be configured with this parameter. &|| RouterConfiguration { # synchronous: true, @@ -35,12 +35,12 @@ fn App(cx: Scope) -> Element { &|| Segment::empty() ); - cx.render(rsx! { + render! { h1 { "Our sites title" } // The Outlet tells the Router where to render active content. Outlet { } - }) + } } # # let mut vdom = VirtualDom::new(App); diff --git a/docs/router/src/features/navigation/external.md b/docs/router/src/features/navigation/external.md index 74e958672..fa4ce523c 100644 --- a/docs/router/src/features/navigation/external.md +++ b/docs/router/src/features/navigation/external.md @@ -25,7 +25,7 @@ use dioxus_router::prelude::*; fn App(cx: Scope) -> Element { use_router( - &cx, + cx, &|| RouterConfiguration { # synchronous: true, ..Default::default() @@ -33,7 +33,7 @@ fn App(cx: Scope) -> Element { &|| Segment::empty() ); - cx.render(rsx! { + render! { // links need to be inside a router, even if they navigate to an // external page Link { @@ -44,7 +44,7 @@ fn App(cx: Scope) -> Element { target: "https://dioxuslabs.com/", // short form "Go to the dioxus home page 2" } - }) + } } # # let mut vdom = VirtualDom::new(App); diff --git a/docs/router/src/features/navigation/index.md b/docs/router/src/features/navigation/index.md index d98b253a4..ba50c4396 100644 --- a/docs/router/src/features/navigation/index.md +++ b/docs/router/src/features/navigation/index.md @@ -24,7 +24,7 @@ use like this: # extern crate dioxus_router; # use dioxus_router::prelude::*; fn SomeComponent(cx: Scope) -> Element { - cx.render(rsx! { + render! { Link { target: NavigationTarget::Internal(String::from("/some/path")), "Link text" @@ -33,18 +33,18 @@ fn SomeComponent(cx: Scope) -> Element { target: "/some/path", // short form "Other link text" } - }) + } } ``` The `target` in the example above is similar to the `href` of a regular anchor element. However, it tells the router more about what kind of navigation it should perform: -- The example uses [`InternalTarget`]. We give it an arbitrary path that will be +- The example uses [`Internal`]. We give it an arbitrary path that will be merged with the current URL. -- [`NamedTarget`] allows us to navigate within our app using predefined names. +- [`Named`] allows us to navigate within our app using predefined names. See the chapter about [named navigation](./name.md) for more details. -- [`ExternalTarget`] allows us to navigate to URLs outside of our app. See the +- [`External`] allows us to navigate to URLs outside of our app. See the chapter about [external navigation](./external.md) for more details. > The [`Link`] accepts several props that modify its behavior. See the API docs diff --git a/docs/router/src/features/navigation/name.md b/docs/router/src/features/navigation/name.md index 9a399b4db..b3efc9d35 100644 --- a/docs/router/src/features/navigation/name.md +++ b/docs/router/src/features/navigation/name.md @@ -39,25 +39,25 @@ use dioxus_router::prelude::*; struct TargetName; fn Source(cx: Scope) -> Element { - cx.render(rsx! { + render! { Link { // instead of InternalTarget we use NamedTarget (via the `named` fn) // we can use the returned value to add parameters or a query target: named::().query("query"), "Go to target" } - }) + } } fn Target(cx: Scope) -> Element { - cx.render(rsx! { + render! { h1 { "Target" } - }) + } } fn App(cx: Scope) -> Element { use_router( - &cx, + cx, &|| RouterConfiguration { # synchronous: true, ..Default::default() @@ -71,9 +71,9 @@ fn App(cx: Scope) -> Element { } ); - cx.render(rsx! { + render! { Outlet { } - }) + } } # # let mut vdom = VirtualDom::new(App); @@ -103,7 +103,7 @@ use dioxus_router::prelude::*; struct SomeName; fn Content(cx: Scope) -> Element { - let route = use_route(&cx).expect("needs to be in router"); + let route = use_route(cx).expect("needs to be in router"); if route.is_at(&named::(), false) { // do something diff --git a/docs/router/src/features/navigation/programmatic.md b/docs/router/src/features/navigation/programmatic.md index 917c5c4a1..9a54d1ccd 100644 --- a/docs/router/src/features/navigation/programmatic.md +++ b/docs/router/src/features/navigation/programmatic.md @@ -15,7 +15,7 @@ use dioxus::prelude::*; use dioxus_router::prelude::*; fn Content(cx: Scope) -> Element { - let nav = use_navigate(&cx).expect("called inside a router"); + let nav = use_navigate(cx).expect("called inside a router"); // ... # unimplemented!() @@ -40,7 +40,7 @@ We can use the [`Navigator`] to trigger four different kinds of navigation: # use dioxus_router::prelude::*; # fn Content(cx: Scope) -> Element { - let nav = use_navigate(&cx).expect("called inside a router"); + let nav = use_navigate(cx).expect("called inside a router"); // push nav.push("/target"); diff --git a/docs/router/src/features/outlets.md b/docs/router/src/features/outlets.md index 2e4e20068..db46420bd 100644 --- a/docs/router/src/features/outlets.md +++ b/docs/router/src/features/outlets.md @@ -12,14 +12,14 @@ the active routes content will be rendered within the [`Outlet`]. # extern crate dioxus_ssr; fn Index(cx: Scope) -> Element { - cx.render(rsx! { + render! { h1 { "Index" } - }) + } } fn App(cx: Scope) -> Element { use_router( - &cx, + cx, &|| RouterConfiguration { # synchronous: true, ..Default::default() @@ -27,11 +27,11 @@ fn App(cx: Scope) -> Element { &|| Segment::content(comp(Index)) ); - cx.render(rsx! { + render! { header { "header" } - Outlet {} + Outlet { } footer { "footer" } - }) + } } # # let mut vdom = VirtualDom::new(App); @@ -84,21 +84,21 @@ put the side content. # fn Main(cx: Scope) -> Element { - cx.render(rsx! { + render! { main { "Main Content" } - }) + } } struct AsideName; fn Aside(cx: Scope) -> Element { - cx.render(rsx! { + render! { aside { "Side Content" } - }) + } } fn App(cx: Scope) -> Element { use_router( - &cx, + cx, &|| RouterConfiguration { # synchronous: true, ..Default::default() @@ -111,12 +111,12 @@ fn App(cx: Scope) -> Element { } ); - cx.render(rsx! { + render! { Outlet { } Outlet { name: Name::of::() } - }) + } } # # let mut vdom = VirtualDom::new(App); @@ -152,21 +152,21 @@ easy to create an unterminated recursion. See below for an example of that. # extern crate dioxus_ssr; # fn RootContent(cx: Scope) -> Element { - cx.render(rsx! { + render! { h1 { "Root" } Outlet { } - }) + } } fn NestedContent(cx: Scope) -> Element { - cx.render(rsx! { + render! { h2 { "Nested" } - }) + } } fn App(cx: Scope) -> Element { use_router( - &cx, + cx, &|| RouterConfiguration { # synchronous: true, # history: Box::new(MemoryHistory::with_initial_path("/root").unwrap()), @@ -182,11 +182,11 @@ fn App(cx: Scope) -> Element { } ); - cx.render(rsx! { + render! { Outlet { depth: 1 } - }) + } } # # let mut vdom = VirtualDom::new(App); @@ -215,31 +215,31 @@ This code will create a crash due to an unterminated recursion using # use dioxus_router::prelude::*; # fn Content(cx: Scope) -> Element { - cx.render(rsx! { + render! { h1 { "Heyho!" } Outlet { depth: 0, } - }) + } } fn App(cx: Scope) -> Element { - use_router(&cx, &Default::default, &|| Segment::content(comp(Content))); + use_router(cx, &Default::default, &|| Segment::content(comp(Content))); - cx.render(rsx! { + render! { Outlet { } - }) + } } ``` -The [`Outlet`] directly within the [`Router`] has no parent [`Outlet`], so its -depth will be `0`. When rendering for the path `/`, it therefore will render the +The [`Outlet`] in the `App` component has no parent [`Outlet`], so its depth +will be `0`. When rendering for the path `/`, it therefore will render the `Content` component. -The `Content` component will render an `h1` and an [`Outlet`]. That [`Outlet`] -would usually have a depth of `1`, since its a descendant of the [`Outlet`] in -the [`Router`]. However, we override its depth to `0`, so it will render the -`Content` component. +The `Content` component will render an `h1` and an [`Outlet`]. That [`OUtlet`] +would usually have a depth of `1`, since it is a descendant of the [`Outlet`] in +the `App` component. However, we override its depth to `0`, so it will render +the `Content` component. That means the `Content` component will recurse until someone (e.g. the OS) puts a stop to it. diff --git a/docs/router/src/features/query.md b/docs/router/src/features/query.md index 2bb93df4e..7f79c4607 100644 --- a/docs/router/src/features/query.md +++ b/docs/router/src/features/query.md @@ -16,7 +16,7 @@ use dioxus::prelude::*; use dioxus_router::prelude::*; fn SomeComponent(cx: Scope) -> Element { - let route = use_route(&cx).expect("nested in Router"); + let route = use_route(cx).expect("nested in Router"); let query = route.query.clone().unwrap(); @@ -40,7 +40,7 @@ When using [`Internal`] or [`External`] we have to append our query manually. # use dioxus_router::prelude::*; # fn SomeComponent(cx: Scope) -> Element { - cx.render(rsx! { + render! { Link { target: NavigationTarget::Internal("/some/path?query=yes".into()), "Internal target" @@ -49,7 +49,7 @@ fn SomeComponent(cx: Scope) -> Element { target: NavigationTarget::External("https://dioxuslab.com?query=yes".into()), "External target" } - }) + } } ``` @@ -66,7 +66,7 @@ a function. # struct Target; # fn SomeComponent(cx: Scope) -> Element { - cx.render(rsx! { + render! { Link { target: named::().query("query=yes"), "Query String" @@ -75,7 +75,7 @@ fn SomeComponent(cx: Scope) -> Element { target: named::().query(vec![("query", "yes")]), "Query Vec" } - }) + } } ``` diff --git a/docs/router/src/features/routes/catch_all.md b/docs/router/src/features/routes/catch_all.md index 123ad6c6d..53f578a35 100644 --- a/docs/router/src/features/routes/catch_all.md +++ b/docs/router/src/features/routes/catch_all.md @@ -33,14 +33,14 @@ use dioxus_router::prelude::*; struct Name; fn Greeting(cx: Scope) -> Element { - let route = use_route(&cx).expect("is nested within a Router component"); + let route = use_route(cx).expect("is nested within a Router component"); let name = route.parameter::() .map(|name| name.clone()) .unwrap_or(String::from("world")); - cx.render(rsx! { + render! { p { "Hello, {name}!" } - }) + } } ``` @@ -66,7 +66,7 @@ struct Name; fn App(cx: Scope) -> Element { use_router( - &cx, + cx, &|| RouterConfiguration { ..Default::default() }, @@ -120,19 +120,19 @@ by the path, i.e. `//`. struct Name; fn Greeting(cx: Scope) -> Element { - let route = use_route(&cx).expect("is nested within a Router component"); + let route = use_route(cx).expect("is nested within a Router component"); let name = route.parameter::() .map(|name| name.clone()) .unwrap_or(String::from("world")); - cx.render(rsx! { + render! { p { "Hello, {name}!" } - }) + } } fn App(cx: Scope) -> Element { let routes = use_router( - &cx, + cx, &|| RouterConfiguration { # synchronous: true, # history: Box::new(MemoryHistory::with_initial_path("/Dioxus").unwrap()), @@ -141,9 +141,9 @@ fn App(cx: Scope) -> Element { &|| Segment::empty().catch_all((comp(Greeting), Name { })) ); // ... - cx.render(rsx! { + render! { Outlet { } - }) + } } # # let mut vdom = VirtualDom::new(App); diff --git a/docs/router/src/features/routes/fallback.md b/docs/router/src/features/routes/fallback.md index 3ede8fb07..2749b81a2 100644 --- a/docs/router/src/features/routes/fallback.md +++ b/docs/router/src/features/routes/fallback.md @@ -20,21 +20,21 @@ use dioxus_router::{history::MemoryHistory, prelude::*}; # extern crate dioxus_ssr; fn Index(cx: Scope) -> Element { - cx.render(rsx! { + render! { h1 { "Index" } - }) + } } fn Fallback(cx: Scope) -> Element { - cx.render(rsx! { + render! { h1 { "Error 404 - Not Found" } p { "The page you asked for doesn't exist." } - }) + } } fn App(cx: Scope) -> Element { use_router( - &cx, + cx, &|| RouterConfiguration { # synchronous: true, # history: Box::new(MemoryHistory::with_initial_path("/invalid").unwrap()), @@ -45,9 +45,9 @@ fn App(cx: Scope) -> Element { } ); - cx.render(rsx! { + render! { Outlet { } - }) + } } # # let mut vdom = VirtualDom::new(App); @@ -90,20 +90,20 @@ use dioxus_router::{history::MemoryHistory, prelude::*}; # fn PrivacySettings(cx: Scope) -> Element { unimplemented!() } fn GlobalFallback(cx: Scope) -> Element { - cx.render(rsx! { + render! { h1 { "Error 404 - Page Not Found" } - }) + } } fn SettingsFallback(cx: Scope) -> Element { - cx.render(rsx! { + render! { h1 { "Error 404 - Settings Not Found" } - }) + } } fn App(cx: Scope) -> Element { use_router( - &cx, + cx, &|| RouterConfiguration { # synchronous: true, # history: Box::new(MemoryHistory::with_initial_path("/settings/invalid").unwrap()), @@ -122,9 +122,9 @@ fn App(cx: Scope) -> Element { } ); - cx.render(rsx! { + render! { Outlet { } - }) + } } # # let mut vdom = VirtualDom::new(App); diff --git a/docs/router/src/features/routes/index.md b/docs/router/src/features/routes/index.md index 7e65e08de..6cceb6f36 100644 --- a/docs/router/src/features/routes/index.md +++ b/docs/router/src/features/routes/index.md @@ -15,15 +15,15 @@ use dioxus::prelude::*; use dioxus_router::prelude::*; fn Index(cx: Scope) -> Element { - cx.render(rsx! { + render! { h1 { "Welcome to our test site!" } - }) + } } fn Other(cx: Scope) -> Element { - cx.render(rsx! { + render! { p { "some other content" } - }) + } } ``` @@ -46,7 +46,7 @@ are active, when we don't specify a route. # fn App(cx: Scope) -> Element { use_router( - &cx, + cx, &|| RouterConfiguration { ..Default::default() }, @@ -77,7 +77,7 @@ specified in the path. In the example, the path must be `/other`. # fn App(cx: Scope) -> Element { use_router( - &cx, + cx, &|| RouterConfiguration { ..Default::default() }, @@ -100,20 +100,20 @@ use dioxus_router::{history::MemoryHistory, prelude::*}; # extern crate dioxus_ssr; fn Index(cx: Scope) -> Element { - cx.render(rsx! { + render! { h1 { "Welcome to our test site!" } - }) + } } fn Other(cx: Scope) -> Element { - cx.render(rsx! { + render! { p { "some other content" } - }) + } } fn App(cx: Scope) -> Element { use_router( - &cx, + cx, &|| RouterConfiguration { # synchronous: true, # history: Box::new(MemoryHistory::with_initial_path("/other").unwrap()), @@ -122,9 +122,9 @@ fn App(cx: Scope) -> Element { &|| Segment::content(comp(Index)).fixed("other", comp(Other)) ); - cx.render(rsx! { + render! { Outlet { } - }) + } } # # let mut vdom = VirtualDom::new(App); diff --git a/docs/router/src/features/routes/matching.md b/docs/router/src/features/routes/matching.md index 3d0114a5c..89b7b8f97 100644 --- a/docs/router/src/features/routes/matching.md +++ b/docs/router/src/features/routes/matching.md @@ -30,7 +30,7 @@ use regex::Regex; struct Name; fn GreetingFemale(cx: Scope) -> Element { - let route = use_route(&cx).unwrap(); + let route = use_route(cx).unwrap(); let name = route.parameter::() .map(|name| { let mut name = name.to_string(); @@ -39,13 +39,13 @@ fn GreetingFemale(cx: Scope) -> Element { }) .unwrap_or(String::from("Anonymous")); - cx.render(rsx! { + render! { p { "Hello Mrs. {name}" } - }) + } } fn GreetingMale(cx: Scope) -> Element { - let route = use_route(&cx).unwrap(); + let route = use_route(cx).unwrap(); let name = route.parameter::() .map(|name| { let mut name = name.to_string(); @@ -54,32 +54,32 @@ fn GreetingMale(cx: Scope) -> Element { }) .unwrap_or(String::from("Anonymous")); - cx.render(rsx! { + render! { p { "Hello Mr. {name}" } - }) + } } fn GreetingWithoutGender(cx: Scope) -> Element { - let route = use_route(&cx).unwrap(); + let route = use_route(cx).unwrap(); let name = route.parameter::() .map(|name| name.to_string()) .unwrap_or(String::from("Anonymous")); - cx.render(rsx! { + render! { p { "Hello {name}" } - }) + } } fn GreetingKenobi(cx: Scope) -> Element { - cx.render(rsx! { + render! { p { "Hello there." } p { "General Kenobi." } - }) + } } fn App(cx: Scope) -> Element { use_router( - &cx, + cx, &|| RouterConfiguration { # synchronous: true, # history: Box::new(MemoryHistory::with_initial_path("/fAnna").unwrap()), @@ -100,9 +100,9 @@ fn App(cx: Scope) -> Element { } ); - cx.render(rsx! { + render! { Outlet { } - }) + } } # # let mut vdom = VirtualDom::new(App); diff --git a/docs/router/src/features/routes/multiple-and-redirect.md b/docs/router/src/features/routes/multiple-and-redirect.md index 8ac24d360..988bcdb5a 100644 --- a/docs/router/src/features/routes/multiple-and-redirect.md +++ b/docs/router/src/features/routes/multiple-and-redirect.md @@ -25,14 +25,14 @@ use dioxus_router::{history::MemoryHistory, prelude::*}; # extern crate dioxus_ssr; fn Home(cx: Scope) -> Element { - cx.render(rsx! { + render! { h1 { "Home Page" } - }) + } } fn App(cx: Scope) -> Element { use_router( - &cx, + cx, &|| RouterConfiguration { # synchronous: true, # history: Box::new(MemoryHistory::with_initial_path("/home").unwrap()), @@ -49,9 +49,9 @@ fn App(cx: Scope) -> Element { .fixed("start", "/") // short form }); - cx.render(rsx! { + render! { Outlet { } - }) + } } # # let mut vdom = VirtualDom::new(App); diff --git a/docs/router/src/features/routes/nested.md b/docs/router/src/features/routes/nested.md index 897b1c9d6..152d423ee 100644 --- a/docs/router/src/features/routes/nested.md +++ b/docs/router/src/features/routes/nested.md @@ -48,28 +48,28 @@ the first one, and will in turn render our nested content. # use dioxus_router::prelude::*; # fn Settings(cx: Scope) -> Element { - cx.render(rsx! { + render! { h1 { "Settings" } Outlet { } - }) + } } fn GeneralSettings(cx: Scope) -> Element { - cx.render(rsx! { + render! { h2 { "General Settings" } - }) + } } fn PWSettings(cx: Scope) -> Element { - cx.render(rsx! { + render! { h2 { "Password Settings" } - }) + } } fn PrivacySettings(cx: Scope) -> Element { - cx.render(rsx! { + render! { h2 { "Privacy Settings" } - }) + } } ``` @@ -90,7 +90,7 @@ we'll use a method of [`Route`], so we might as well add this now. # fn App(cx: Scope) -> Element { use_router( - &cx, + cx, &|| RouterConfiguration { ..Default::default() }, @@ -123,7 +123,7 @@ pass it to the [`Route`] on the root segment. # fn App(cx: Scope) -> Element { use_router( - &cx, + cx, &|| RouterConfiguration { ..Default::default() }, @@ -152,33 +152,33 @@ fn App(cx: Scope) -> Element { # extern crate dioxus_ssr; # fn Settings(cx: Scope) -> Element { - cx.render(rsx! { + render! { h1 { "Settings" } Outlet { } - }) + } } fn GeneralSettings(cx: Scope) -> Element { - cx.render(rsx! { + render! { h2 { "General Settings" } - }) + } } fn PWSettings(cx: Scope) -> Element { - cx.render(rsx! { + render! { h2 { "Password Settings" } - }) + } } fn PrivacySettings(cx: Scope) -> Element { - cx.render(rsx! { + render! { h2 { "Privacy Settings" } - }) + } } fn App(cx: Scope) -> Element { use_router( - &cx, + cx, &|| RouterConfiguration { # synchronous: true, # history: Box::new(MemoryHistory::with_initial_path("/settings/privacy").unwrap()), @@ -194,9 +194,9 @@ fn App(cx: Scope) -> Element { ) ); - cx.render(rsx! { + render! { Outlet { } - }) + } } # # let mut vdom = VirtualDom::new(App); diff --git a/docs/router/src/features/routing-update-callback.md b/docs/router/src/features/routing-update-callback.md index cbf4ce76e..c24a28a20 100644 --- a/docs/router/src/features/routing-update-callback.md +++ b/docs/router/src/features/routing-update-callback.md @@ -32,7 +32,7 @@ use dioxus_router::prelude::*; fn App(cx: Scope) -> Element { use_router( - &cx, + cx, &|| RouterConfiguration { # synchronous: true, on_update: Some(Arc::new(|state| -> Option { diff --git a/docs/router/src/features/sitemap-generation.md b/docs/router/src/features/sitemap-generation.md index efd449401..15e653f2f 100644 --- a/docs/router/src/features/sitemap-generation.md +++ b/docs/router/src/features/sitemap-generation.md @@ -15,37 +15,37 @@ use dioxus_router::{history::MemoryHistory, prelude::*}; # extern crate dioxus_ssr; fn Home(cx: Scope) -> Element { - cx.render(rsx! { + render! { h1 { "Home" } - }) + } } fn Fixed(cx: Scope) -> Element { - cx.render(rsx! { + render! { h1 { "Fixed" } Outlet { } - }) + } } fn Nested(cx: Scope) -> Element { - cx.render(rsx! { + render! { h2 { "Nested" } - }) + } } struct ParameterName; fn Parameter(cx: Scope) -> Element { - let route = use_route(&cx).unwrap(); + let route = use_route(cx).unwrap(); let param = route.parameter::().unwrap_or_default(); - cx.render(rsx! { + render! { h1 { "Parameter: {param}" } - }) + } } fn App(cx: Scope) -> Element { use_router( - &cx, + cx, &|| RouterConfiguration { # synchronous: true, history: Box::new(MemoryHistory::with_initial_path("/fixed/nested").unwrap()), @@ -63,9 +63,9 @@ fn App(cx: Scope) -> Element { } ); - cx.render(rsx! { + render! { Outlet { } - }) + } } # # let mut vdom = VirtualDom::new(App); @@ -92,16 +92,16 @@ our segment definition into its own function. # fn App(cx: Scope) -> Element { use_router( - &cx, + cx, &|| RouterConfiguration { ..Default::default() }, &prepare_routes ); - cx.render(rsx! { + render! { Outlet { } - }) + } } fn prepare_routes() -> Segment {