时间戳

首页 > 解决方案 > 我们可以检查 Blazor 中哪个属性未通过验证吗？

blazor - 我们可以检查 Blazor 中哪个属性未通过验证吗？

问题描述

我有一个 Blazor 组件，它包含一个表单输入和一些额外的标记。感谢@enet 的一些出色帮助（请参阅此答案），我现在有了它，这样如果模型属性的验证失败，则<ValidationMessage>正确显示消息。

但是，我希望这个<ValidationMessage>标签被 HTML 包围，它只在显示验证消息时出现，即当该属性的验证失败时。我可以通过引入 private 来做到这一点bool，并按如下方式使用它......

    @if (_showValidationMsg) {
      <div class="input-group-append"><label class="input-group-text has-error" for="@PropertyName">
        <ValidationMessage For="@ValueExpression" /></label>
      </div>
    }

@code {
  // other stuff here as well

  private bool _showValidationMsg = false;

  private async Task OnChanged(ChangeEventArgs cea) {
    await ValueChanged.InvokeAsync(cea.Value?.ToString() ?? "");
    FieldIdentifier identifier = CascadedEditContext.Field(PropertyName);
    CascadedEditContext.NotifyFieldChanged(identifier);
    _showValidationMsg = !CascadedEditContext.Validate();
  }

}

当组件只有一个输入元素，但我的一个组件有两个输入控件时，这工作正常，我想知道哪个验证失败，所以我可以显示/隐藏正确的 HTML 位。

有没有办法找出哪些模型属性验证失败？

标签： blazor

解决方案

一旦你调用CascadedEditContext.Validate了（你可以忽略结果，因为你不需要它，见下文），你就可以使用它GetValidationMessages来获取属性的验证消息。如果没有，则通过验证。

使用您的代码作为基础，您可以将其包装成一个可重用的方法，如下所示......

private async Task<bool> CheckValidationFor(ChangeEventArgs cea, EventCallback<string> valueChangedEventCallback, string propertyName) {
  await valueChangedEventCallback.InvokeAsync(cea.Value?.ToString() ?? "");
  FieldIdentifier identifier = CascadedEditContext.Field(propertyName);
  CascadedEditContext.NotifyFieldChanged(identifier);
  CascadedEditContext.Validate();
  return CascadedEditContext.GetValidationMessages(identifier).Any();

}

然后，您可以将OnChanged1代码简化为...

private async Task OnChanged1(ChangeEventArgs cea) =>
  _showValidationMsg1 = await CheckValidationFor(cea, Value1Changed, PropertyName1);

同样对于OnChanged2

推荐阅读