此项目已迁移

此项目已并入 Yew 仓库，具体位置可在此找到：这里。您应在此处提出所有问题或改进建议，而不是在此处。此仓库将在不久的将来存档。

yew-router

Yew前端框架的路由库。

示例

#[derive(Switch, Debug)]
pub enum AppRoute {
    #[to = "/profile/{id}"]
    Profile(u32),
    #[to = "/forum{*:rest}"]
    Forum(ForumRoute),
    #[to = "/"]
    Index,
}

#[derive(Switch, Debug)]
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() 设置位置将更改路由而无需再次检索整个应用程序。

服务器配置

为了使指向您的web应用程序的外部链接能够正常工作，服务器必须配置为对于任何本来会返回404错误（对于任何可能的客户端路由）的GET请求返回 index.html 文件。不能是 3xx 重定向到 index.html，因为这会改变浏览器的URL，导致路由失败 - 它必须是包含 index.html 内容的 200 响应。一旦 index.html 的内容加载，它将依次加载您的其他资产，您的应用程序将启动，路由器将检测当前路由，并相应地设置您的应用程序状态。

如果您选择从与您的API相同的服务器提供应用程序，建议您将API挂载在/api下，并将资源挂载在/下，并让/返回index.html的内容。

有关如何配置webpack开发服务器以实现此行为的详细信息，请参阅https://webpack.js.cn/configuration/dev-server/#devserverhistoryapifallback。

如何包含

您可以通过将这些添加到依赖项中，使用已发布的版本。

[dependencies]
yew-router = "0.7.0"
yew = "0.10.1"

您可以通过将以下内容添加到依赖项中来在项目中使用正在开发中的版本

[dependencies]
yew-router = { git = "https://github.com/yewstack/yew_router", branch="master" }
yew = {git = "https://github.com/yewstack/yew", branch = "master"}

最低rustc版本

目前，此库针对rustc 1.39.0，但在最新稳定版本上进行开发。此库旨在跟踪Yew的最小支持rustc版本。

贡献/请求

如果您有任何问题、建议或想要贡献，请创建一个Issue或PR，我们将及时回复您。