From 96a40eff17f5597d0d14eb0358ba1d2019c7ebce Mon Sep 17 00:00:00 2001 From: sasa cocic Date: Fri, 7 Oct 2022 15:12:03 +0800 Subject: [PATCH 1/6] Mention certain components must be children of Router --- website/docs/concepts/router.mdx | 6 ++++-- website/versioned_docs/version-0.19.0/concepts/router.mdx | 8 +++++--- 2 files changed, 9 insertions(+), 5 deletions(-) diff --git a/website/docs/concepts/router.mdx b/website/docs/concepts/router.mdx index 407601caba7..c4d483ff5cf 100644 --- a/website/docs/concepts/router.mdx +++ b/website/docs/concepts/router.mdx @@ -45,7 +45,9 @@ matched, the router navigates to the path with `not_found` attribute. If no rout a message is logged to console stating that no route was matched. Finally, you need to register one of the Router context provider components like ``. -It provides location information and navigator to its children. +It provides location information and navigator to its children. I.e. certain components depend on the +functionality provided by the Router to work properly e.g. `` and ``. That means +they must be wrapped in a Router (children of ``). This is shown in the code below. :::caution When using `yew-router` in browser environment, `` is highly recommended. @@ -94,7 +96,7 @@ fn switch(routes: Route) -> Html { fn app() -> Html { html! { - render={switch} /> + render={switch} /> // <- depends on functionality } } diff --git a/website/versioned_docs/version-0.19.0/concepts/router.mdx b/website/versioned_docs/version-0.19.0/concepts/router.mdx index 02ba893f9a4..d6875be8e3b 100644 --- a/website/versioned_docs/version-0.19.0/concepts/router.mdx +++ b/website/versioned_docs/version-0.19.0/concepts/router.mdx @@ -42,8 +42,10 @@ current URL and passes it to the `render` callback. The callback then decides wh matched, the router navigates to the path with `not_found` attribute. If no route is specified, nothing is rendered, and a message is logged to console stating that no route was matched. -Finally, you need to register the `` component as a context. -`` provides session history information to its children. +Finally, you need to register one of the Router context provider components like ``. +It provides location information and navigator to its children. I.e. certain components depend on the +functionality provided by the Router to work properly e.g. `` and ``. That means +they must be wrapped in a Router (children of ``). This is shown in the code below. When using `yew-router` in browser environment, `` is recommended. @@ -89,7 +91,7 @@ fn switch(routes: &Route) -> Html { fn app() -> Html { html! { - render={Switch::render(switch)} /> + render={switch} /> // <- depends on functionality } } From 802b91f3bfde0ada88e775359418d4e3a58ba83e Mon Sep 17 00:00:00 2001 From: sasa cocic Date: Sun, 9 Oct 2022 18:48:00 +0800 Subject: [PATCH 2/6] make suggested changes --- website/docs/concepts/router.mdx | 9 ++++----- .../versioned_docs/version-0.19.0/concepts/router.mdx | 9 ++++----- 2 files changed, 8 insertions(+), 10 deletions(-) diff --git a/website/docs/concepts/router.mdx b/website/docs/concepts/router.mdx index c4d483ff5cf..7060b1271d4 100644 --- a/website/docs/concepts/router.mdx +++ b/website/docs/concepts/router.mdx @@ -44,10 +44,9 @@ current URL and passes it to the `render` callback. The callback then decides wh matched, the router navigates to the path with `not_found` attribute. If no route is specified, nothing is rendered, and a message is logged to console stating that no route was matched. -Finally, you need to register one of the Router context provider components like ``. -It provides location information and navigator to its children. I.e. certain components depend on the -functionality provided by the Router to work properly e.g. `` and ``. That means -they must be wrapped in a Router (children of ``). This is shown in the code below. +The router components, e.g. `` and ``, must be used in the [context](concepts/contexts.mdx) +of a Router provider like ``. That means they must be wrapper in a router (children of ``). +This is shown below. :::caution When using `yew-router` in browser environment, `` is highly recommended. @@ -96,7 +95,7 @@ fn switch(routes: Route) -> Html { fn app() -> Html { html! { - render={switch} /> // <- depends on functionality + render={switch} /> // <- depends on } } diff --git a/website/versioned_docs/version-0.19.0/concepts/router.mdx b/website/versioned_docs/version-0.19.0/concepts/router.mdx index d6875be8e3b..b255eaf4ec0 100644 --- a/website/versioned_docs/version-0.19.0/concepts/router.mdx +++ b/website/versioned_docs/version-0.19.0/concepts/router.mdx @@ -42,10 +42,9 @@ current URL and passes it to the `render` callback. The callback then decides wh matched, the router navigates to the path with `not_found` attribute. If no route is specified, nothing is rendered, and a message is logged to console stating that no route was matched. -Finally, you need to register one of the Router context provider components like ``. -It provides location information and navigator to its children. I.e. certain components depend on the -functionality provided by the Router to work properly e.g. `` and ``. That means -they must be wrapped in a Router (children of ``). This is shown in the code below. +The router components, e.g. `` and ``, must be used in the [context](concepts/contexts.mdx) +of a Router provider like ``. That means they must be wrapper in a router (children of ``). +This is shown below. When using `yew-router` in browser environment, `` is recommended. @@ -91,7 +90,7 @@ fn switch(routes: &Route) -> Html { fn app() -> Html { html! { - render={switch} /> // <- depends on functionality + render={switch} /> // <- depends on } } From 66aa852d0d885b8311ad239207ef134379939e60 Mon Sep 17 00:00:00 2001 From: sasa cocic Date: Sun, 16 Oct 2022 18:36:42 +0800 Subject: [PATCH 3/6] fix typos --- website/docs/concepts/router.mdx | 2 +- website/versioned_docs/version-0.19.0/concepts/router.mdx | 2 +- 2 files changed, 2 insertions(+), 2 deletions(-) diff --git a/website/docs/concepts/router.mdx b/website/docs/concepts/router.mdx index 7060b1271d4..028f318a9ac 100644 --- a/website/docs/concepts/router.mdx +++ b/website/docs/concepts/router.mdx @@ -95,7 +95,7 @@ fn switch(routes: Route) -> Html { fn app() -> Html { html! { - render={switch} /> // <- depends on + render={switch} /> // <- depends on } } diff --git a/website/versioned_docs/version-0.19.0/concepts/router.mdx b/website/versioned_docs/version-0.19.0/concepts/router.mdx index b255eaf4ec0..646bad4f7c8 100644 --- a/website/versioned_docs/version-0.19.0/concepts/router.mdx +++ b/website/versioned_docs/version-0.19.0/concepts/router.mdx @@ -90,7 +90,7 @@ fn switch(routes: &Route) -> Html { fn app() -> Html { html! { - render={switch} /> // <- depends on + render={Switch::render(switch)} /> // <- depends on } } From 001ce0848dc655651835632f3a2aca99ddb4b7b3 Mon Sep 17 00:00:00 2001 From: sasa cocic Date: Thu, 8 Dec 2022 13:31:25 +0900 Subject: [PATCH 4/6] update documentation with suggested changes again --- website/docs/concepts/router.mdx | 8 ++++---- .../version-0.19.0/concepts/router.mdx | 13 ++++++++----- .../versioned_docs/version-0.20/concepts/router.mdx | 7 ++++--- 3 files changed, 16 insertions(+), 12 deletions(-) diff --git a/website/docs/concepts/router.mdx b/website/docs/concepts/router.mdx index 028f318a9ac..438ff2b419f 100644 --- a/website/docs/concepts/router.mdx +++ b/website/docs/concepts/router.mdx @@ -44,9 +44,9 @@ current URL and passes it to the `render` callback. The callback then decides wh matched, the router navigates to the path with `not_found` attribute. If no route is specified, nothing is rendered, and a message is logged to console stating that no route was matched. -The router components, e.g. `` and ``, must be used in the [context](concepts/contexts.mdx) -of a Router provider like ``. That means they must be wrapper in a router (children of ``). -This is shown below. +Most of yew-router's components, in particular and , must be (grand-)children of one of the Router components +(e.g. ``). You usually only need a single Router in your app, most often rendered immediately by your most top-level `` +component. The Router registers a context, which is needed for Links and Switches to function. An example is shown below. :::caution When using `yew-router` in browser environment, `` is highly recommended. @@ -95,7 +95,7 @@ fn switch(routes: Route) -> Html { fn app() -> Html { html! { - render={switch} /> // <- depends on + render={switch} /> // <- must be child of } } diff --git a/website/versioned_docs/version-0.19.0/concepts/router.mdx b/website/versioned_docs/version-0.19.0/concepts/router.mdx index 646bad4f7c8..e92dcd1dc3b 100644 --- a/website/versioned_docs/version-0.19.0/concepts/router.mdx +++ b/website/versioned_docs/version-0.19.0/concepts/router.mdx @@ -42,11 +42,14 @@ current URL and passes it to the `render` callback. The callback then decides wh matched, the router navigates to the path with `not_found` attribute. If no route is specified, nothing is rendered, and a message is logged to console stating that no route was matched. -The router components, e.g. `` and ``, must be used in the [context](concepts/contexts.mdx) -of a Router provider like ``. That means they must be wrapper in a router (children of ``). -This is shown below. +Most of yew-router's components, in particular `` and ``, must be (grand-)children of one of the Router components +(e.g. ``). You usually only need a single Router in your app, most often rendered immediately by your most top-level `` +component. The Router registers a context, which is needed for Links and Switches to function. An example is shown below. -When using `yew-router` in browser environment, `` is recommended. +:::caution +When using `yew-router` in browser environment, `` is highly recommended. +You can find other router flavours in the [API Reference](https://docs.rs/yew-router/). +::: ```rust use yew_router::prelude::*; @@ -90,7 +93,7 @@ fn switch(routes: &Route) -> Html { fn app() -> Html { html! { - render={Switch::render(switch)} /> // <- depends on + render={Switch::render(switch)} /> // <- must be child of } } diff --git a/website/versioned_docs/version-0.20/concepts/router.mdx b/website/versioned_docs/version-0.20/concepts/router.mdx index 407601caba7..6015c9706c3 100644 --- a/website/versioned_docs/version-0.20/concepts/router.mdx +++ b/website/versioned_docs/version-0.20/concepts/router.mdx @@ -44,8 +44,9 @@ current URL and passes it to the `render` callback. The callback then decides wh matched, the router navigates to the path with `not_found` attribute. If no route is specified, nothing is rendered, and a message is logged to console stating that no route was matched. -Finally, you need to register one of the Router context provider components like ``. -It provides location information and navigator to its children. +Most of yew-router's components, in particular `` and ``, must be (grand-)children of one of the Router components +(e.g. ``). You usually only need a single Router in your app, most often rendered immediately by your most top-level `` +component. The Router registers a context, which is needed for Links and Switches to function. An example is shown below. :::caution When using `yew-router` in browser environment, `` is highly recommended. @@ -94,7 +95,7 @@ fn switch(routes: Route) -> Html { fn app() -> Html { html! { - render={switch} /> + render={switch} /> // <- must be child of } } From 331ccfc454ca0d78c509954277e9516c3574b143 Mon Sep 17 00:00:00 2001 From: sasa cocic Date: Thu, 8 Dec 2022 13:33:46 +0900 Subject: [PATCH 5/6] change /> to > in comment --- website/versioned_docs/version-0.20/concepts/router.mdx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/website/versioned_docs/version-0.20/concepts/router.mdx b/website/versioned_docs/version-0.20/concepts/router.mdx index 6015c9706c3..3569d31e181 100644 --- a/website/versioned_docs/version-0.20/concepts/router.mdx +++ b/website/versioned_docs/version-0.20/concepts/router.mdx @@ -95,7 +95,7 @@ fn switch(routes: Route) -> Html { fn app() -> Html { html! { - render={switch} /> // <- must be child of + render={switch} /> // <- must be child of } } From c574adbc01239e3badf7670f40197f0fbfb8ac5f Mon Sep 17 00:00:00 2001 From: sasa cocic Date: Thu, 8 Dec 2022 15:09:41 +0900 Subject: [PATCH 6/6] add ticks to Link & Switch in concepts/router.mdx --- website/docs/concepts/router.mdx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/website/docs/concepts/router.mdx b/website/docs/concepts/router.mdx index 438ff2b419f..3569d31e181 100644 --- a/website/docs/concepts/router.mdx +++ b/website/docs/concepts/router.mdx @@ -44,7 +44,7 @@ current URL and passes it to the `render` callback. The callback then decides wh matched, the router navigates to the path with `not_found` attribute. If no route is specified, nothing is rendered, and a message is logged to console stating that no route was matched. -Most of yew-router's components, in particular and , must be (grand-)children of one of the Router components +Most of yew-router's components, in particular `` and ``, must be (grand-)children of one of the Router components (e.g. ``). You usually only need a single Router in your app, most often rendered immediately by your most top-level `` component. The Router registers a context, which is needed for Links and Switches to function. An example is shown below.