Blazor 参数为 Null 值

Question

我们有一个 Blazor Server 应用程序核心 3.1 ，我们添加一个组件并从导航中调用它，如下所示

<a href="/Claimaction" class="nav-link">
                        <i class="far fa-circle nav-icon"></i>
                        <p>Claims</p>
                    </a>

有时我想通过其他组件使用“/Claimaction/PId”等参数来访问此组件，并且我想通过组件本身的输入直接设置此参数，但是当从 NAV 调用组件时没有参数值时，组件集抱歉，有该地址没有任何内容。如何解决此问题以允许用户通过三种方式设置参数值

1. 通过 Nav 像“/Claimaction/100001”
2. 按组件输入控制
3. 允许使用 Null 参数值打开组件

Answer 1

我认为您正在寻找的是可选的 Route 参数。

从 .Net5 开始，原生存在可选路由参数。?只需在参数末尾添加一个即可。

@page "/Claimaction/{ClaimsId:int}"
@* if navigation without id, should be possible, this route is needed too  *@
@page "/Claimaction"
  
@* for .NET 5 only on @page directive is needed
    @page "/Claimaction/{ClaimsId:int?}"
*@

@code{

  [Parameter]
  public Int32? ClaimsId { get; set; }

  public override async Task OnParametersSetAsync()
  {
        await base.OnParametersSetAsync();
        ClaimsId = ClaimsId ?? -1; // set default value if not set via routing or input
  }

}

因为它ClaimsId的名称是路由器参数{ClaimsId:int}，所以当通过 Url 使用时会绑定它，如 /ClaimsAction/10235 （方式 1）

因为ClaimsId是，Parameter您可以通过绑定或任何其他方式设置它。（方式2）。即使@page指令存在，您仍然可以将其用作嵌套在其他组件或布局中的“正常”组件。

因为ClaimsId是可以为 null 的类型，所以它根本不需要值。如果通过路由或输入未收到任何值，则该值将设置为-1。为了实现此行为，我们覆盖SetParamterAsync并设置默认值 ( ClaimsId = ClaimsId ?? -1;)。

我也建议阅读本教程。