2 个版本
0.16.1 | 2022年3月18日 |
---|---|
0.16.0 | 2021年12月17日 |
#5 在 #yew-router 中
770KB
18K SLoC
yew-router-nested
Yew 前端框架的路由库。
注意: 这是对原始 yew-router
(0.15) 库的分支。它被移植到 yew
0.19,以便保持使用嵌套路由的能力。在 yew
0.19 中,对 yew-router
(0.16) 进行了重写,但不再支持路由的嵌套。这个分支存在是为了填补这个空白,直到新的路由获得相同的功能。
示例
#[derive(Switch, Debug, Clone)]
pub enum AppRoute {
#[to = "/profile/{id}"]
Profile(u32),
#[to = "/forum{*:rest}"]
Forum(ForumRoute),
#[to = "/"]
Index,
}
#[derive(Switch, Debug, Clone)]
pub enum ForumRoute {
#[to = "/{subforum}/{thread_slug}"]
SubForumAndThread{subforum: String, thread_slug: String}
#[to = "/{subforum}"]
SubForum{subforum: String}
}
html! {
<Router<AppRoute, ()>
render = Router::render(|switch: AppRoute| {
match switch {
AppRoute::Profile(id) => html!{<ProfileComponent id = id/>},
AppRoute::Index => html!{<IndexComponent/>},
AppRoute::Forum(forum_route) => html!{<ForumComponent route = forum_route/>},
}
})
/>
}
工作原理
这个库通过从浏览器获取 URL 位置并使用它来实例化一个实现了 Switch 类型的类型来工作。仅使用 <a></a>
标签来转到您的路由将不会按预期工作,并且效率低下,因为服务器最多会再次返回整个应用程序包,而在服务器配置不正确的情况下,最坏的情况是仅返回 404 消息。使用这个库的 RouteService,RouteAgent,RouterButton 和 RouterLink 通过 history.push_state()
设置位置,将更改路由而无需再次检索整个应用程序。
服务器配置
为了让外部链接到您的webapp正常工作,服务器必须配置为对于任何本来会返回404错误(对于任何客户端路由)的GET请求,返回index.html文件。不能是重定向到index.html的3xx响应,因为这会改变浏览器中的URL,导致路由失败——必须是包含index.html内容的200响应。一旦index.html的内容加载,它将依次加载您的其余资产,您的应用将启动,路由器将检测当前路由,并相应地设置应用程序状态。
如果您选择从与您的API相同的服务器提供服务,建议将您的API挂载在/api下,将您的资产挂载在/下,并且让/返回index.html的内容。
有关如何配置webpack开发服务器以具有此行为的详细信息,请参阅https://webpack.js.cn/configuration/dev-server/#devserverhistoryapifallback。
如何包含
您可以通过将这些添加到您的依赖项中来使用发行版本。
[dependencies]
yew-router-nested = "0.16.0"
yew = "0.19.0"
您还可以导入包,并在您的代码中保留模块名称yew_router。
[dependencies]
yew-router = { version = "0.16.0", package = "yew-router-nested" }
yew = "0.19.0"
您可以通过将其添加到您的依赖项中来在项目中使用正在开发的版本。
[dependencies]
yew-router = { git = "https://github.com/ctron/yew-router", branch="main" }
yew = {git = "https://github.com/yewstack/yew", branch = "master"}
Minimum rustc
目前,这个库针对rustc 1.39.0,但在最新稳定版本上进行开发。这个库旨在跟踪Yew的最低支持的rustc版本。
贡献/请求
如果您有任何问题、建议或想做出贡献,请打开一个Issue或PR,我们将及时回复您。
依赖
~14MB
~252K SLoC