.NET 5 路由参数

如何解决.NET 5 路由参数

我有两个简单的页面，想将一些参数从一个页面传递到下一个页面。我收到当前代码的错误：

Microsoft.AspNetCore.Components.WebAssembly.Rendering.WebAssemblyRenderer[100] 未处理的异常呈现组件：无法在类型为“PortalUI.Pages.CategoriesPage”的对象上设置属性“ManufacturerID”。错误是：指定的强制转换无效。 system.invalidOperationException：无法在“PortalUI.Pages.CategoriesPage”类型的对象上设置属性“ManufacturerID”。错误是：指定的强制转换无效。 ---> system.invalidCastException: 指定的转换无效。

页面如下（按执行顺序）

@page "/machines/manufacturers"
@inject HttpClient Http
@inject NavigationManager NavManager

<h1>Manufacturers</h1>

<p>display all manufacturers in the database</p>

@if (manufacturers == null)
{
    <p><em>Loading...</em></p>
}
else
{
    @foreach (var i in manufacturers)
    {
        <a @onclick="((args) => Navigate(i.ManufacturerID))">
            <ManufacturersBox Name="@i.Name"
                              imgurL="@i.imgurL" />
        </a>
    }
}

@code {
    private Manufacturers[] manufacturers;

    protected override async Task OnInitializedAsync()
    {
        manufacturers = await Http.GetFromJsonAsync<Manufacturers[]>("https://localhost:44335/api/Manufacturers");
    }

    private void Navigate(int ManufacturerID)
    {
        NavManager.Navigateto($"/machines/manufacturers/{ManufacturerID}/categories");
    }
}

以及我想传递到的页面

@page "/machines/manufacturers/{ManufacturerID}/categories/"

@inject HttpClient Http
@inject NavigationManager NavManager

<h3>CategoriesPage</h3>

<p>This page belongs to @ManufacturerID</p>

@code {
    [Parameter]
    public int ManufacturerID { get; set; }

    private Categories[] categories;

    protected override async Task OnInitializedAsync()
    {
        categories = await Http.GetFromJsonAsync<Categories[]>("https://localhost:44335/api/ManufacturerCategories/" + ManufacturerID);
    }
}

我尝试在链接中使用 href 而不是使用 NavigationManager（我更喜欢使用它，因为它允许用户在点击之前查看屏幕底部的 URL），但两者都给出了相同的答案。

现在考虑到我没有得到 .NET 的默认 404 Page not Found 错误，我认为有些事情正在发生，我只是在某个地方搞砸了。

附加信息：
我的 UI 是 Blazor WebAssembly 应用程序
我的业务逻辑是您可以在 OnInitializedAsync() 中看到的 API

解决方法

您需要按如下方式设置 @page：

@page "/machines/manufacturers/{ManufacturerID:int}/categories/"

路由器从 url 中提取参数作为字符串并将其传递给 RouteView 组件，该组件尝试将字符串作为 ManufacturerID 参数传递给组件。

上述更改告诉路由器将值捕获为 int。

见 - Ms Docs - Route Constraints