具有 Null 值的 Blazor 参数

Question

我们有一个 Blazor Server app core 3.1，我们添加一个组件并像这样从导航调用它

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

有一段时间我想用“/Claimaction/PId”之类的参数让另一个组件到达这个组件 我想直接通过组件本身的输入来设置这个参数 但是当从 NAV 调用组件而没有参数值时，组件集 对不起，这个地址什么都没有。 如何解决此问题以允许用户通过三种方式设置参数值

1. 按导航，例如“/Claimaction/100001”
2. 按组件输入控件
3. 允许使用 Null 参数值打开组件

Answer 1

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

Since .Net5, optional route parameters exist natively。只需在参数末尾添加?即可。

@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}，所以在通过/ClaimsAction/10235（方式1）等Url 使用时会被绑定

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

因为ClaimsId 是可以为空的类型，所以它根本不需要值。如果通过路由或输入都没有收到任何值，则该值将设置为-1。为了实现这种行为，我们覆盖SetParamterAsync 并在那里设置一个默认值（ ClaimsId = ClaimsId ?? -1;）。

我也推荐阅读本教程。