fix queries

This commit is contained in:
Evan Almloff committed 2023-06-01 11:09:51 -05:00
1 parent 2f473f7c97
commit 037a248ad9
294 files changed
+60706 -263

No files matched your search

-90
View File
@@ -1,91 +1 @@
use dioxus::prelude::*;
use dioxus_router::prelude::*;
fn main() {
dioxus_web::launch(App);
}
fn App(cx: Scope) -> Element {
use_router(
cx,
&|| RouterConfiguration::default(),
&|| {
Segment::content(comp(Home))
.fixed("blog", Route::content(comp(Blog)).nested(
Segment::content(comp(BlogList)).catch_all(
ParameterRoute::content::<PostId>(comp(BlogPost))
.name::<BlogPostName>()
)
))
.fixed("myblog", "/blog") // this is new
.fallback(comp(PageNotFound))
}
);
render! {
NavBar {}
Outlet {}
}
}
fn NavBar(cx: Scope) -> Element {
render! {
nav {
ul {
li { Link { target: named::<RootIndex>(), "Home" } }
li { Link { target: "/blog", "Blog" } }
}
}
}
}
fn Home(cx: Scope) -> Element {
render! {
h1 { "Welcome to the Dioxus Blog!" }
}
}
fn Blog(cx: Scope) -> Element {
render! {
h1 { "Blog" }
Outlet {}
}
}
fn BlogList(cx: Scope) -> Element {
render! {
h2 { "Choose a post" }
ul {
li { Link {
target: named::<BlogPostName>().parameter::<PostId>("1"),
"Read the first blog post"
} }
li { Link {
target: named::<BlogPostName>().parameter::<PostId>("2"),
"Read the second blog post"
} }
}
}
}
struct PostId;
struct BlogPostName;
fn BlogPost(cx: Scope) -> Element {
let route = use_route(cx).unwrap();
let post_id = route.parameter::<PostId>();
let post = post_id
.map(|id| id.to_string())
.unwrap_or(String::from("unknown"));
render! {
h2 { "Blog Post: {post}"}
}
}
fn PageNotFound(cx: Scope) -> Element {
render! {
h1 { "Page not found" }
p { "We are terribly sorry, but the page you requested doesn't exist." }
}
}
+5 -6
View File
@@ -1,21 +1,22 @@
# Overview
In this guide you'll learn to effectively use Dioxus Router whether you're
In this guide, you'll learn to effectively use Dioxus Router whether you're
building a small todo app or the next FAANG company. We will create a small
website with a blog, homepage, and more!
> To follow along with the router example, you'll need a working Dioxus app.
> Check out the [Dioxus book][db] to get started.
> Check out the [Dioxus book](https://dioxuslabs.com/docs/0.3/guide/en/) to get started.
> Make sure to add Dioxus Router as a dependency, as explained in the
> [introduction](../index.md).
## You'll learn how to
- Create routes and render "pages".
- Utilize nested routes, create a navigation bar, and render content for a
set of routes.
- Gather URL parameters to dynamically display content.
- Redirect your visitors wherever you want.
- Parse URL parameters to dynamically display content.
- Redirect visitors to different routes.
> **Disclaimer**
>
@@ -26,5 +27,3 @@ website with a blog, homepage, and more!
You can find the complete application in the [full code](./full-code.md)
chapter.
[db]: https://dioxuslabs.com/guide/