Study Blazor .NET（七）路由

翻译自：Study Blazor .NET，转载请注明。

路由

在blazor中客户端路由使用 @page 装饰该组件来实现，就像我们之前示例看到的那样。

//ParentComponent.razor
@page "/parent-component"

<h3> Parent Component</h3>
<p>String in Parent: @parentString</p>
<button onclick="@PassToChild">Pass String To Child</button>

这里 /parent-component 是根 URI 的路由路径。如果把这些组件 *.razor 文件移动到 Pages 文件夹中的任意子文件夹里，这个路由依然是生效的。

路由参数

使用路由参数，可以把参数以查询字符串的方式传递给组件，下面示例代码指定 RouteId 类型为 int ，可以通过 /bindings/ 路由路径传递,

//RouteParamComponent.razor
@page "/bindings/{RouteId:int}"

<p>Route Parameter: @RouteId.ToString()</p> 

@functions {
    [Parameter]
    private int RouteId { get; set; }
}

一个组件可以有多个路由：

//MultipleRouteComponent.razor
@page "/bind"
@page "/bindings"
@page "/one-way-bindings"

<p>Routing</p> 

@functions {
    [Parameter]
    private int sample { get; set; } = 100;
}