fix queries
This commit is contained in:
1 parent
2f473f7c97
commit
037a248ad9
294 files changed
+60706
-263
No files matched your search
@@ -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." }
|
||||
}
|
||||
}
|
||||
@@ -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/
|
||||
Reference in new issue
Block a user