Ant在子组件上设计blazor验证，但不显示验证消息

Question

我正在使用Ant设计Blazor，并尝试创建一个子组件，并像往常一样从父组件应用验证。下面是我的代码。

子组件

<AntDesign.FormItem Label="@Label">
<AntDesign.InputNumber Step="Step" Min="Min" @bind-Value="@Amount" OnChange="OnAmountChanged" 
TValue="double?" />    
</AntDesign.FormItem>
@code {
[Parameter]
public string Label { get; set; }
[Parameter]
public double Step { get; set; }
[Parameter]
public double Min { get; set; } = double.MinValue;
[Parameter]
public double Max { get; set; } = double.MaxValue;
[Parameter]
public string Placeholder { get; set; }
[Parameter]
public double? Amount { get; set; }
[Parameter]
public EventCallback<double?> AmountChanged { get; set; }
private async Task OnAmountChanged(double? value)
{
await AmountChanged.InvokeAsync(value);
}
}

母组件

<AntDesign.Content>
<AntDesign.Form LabelColSpan="8"
WrapperColSpan="16"
Model="@exchangeRate"
OnFinish="@OnFinish"
OnFinishFailed="@OnFinishFailed">
<Validator>
<FluentValidator TValidator="ExchangeRateValidator" />
</Validator>
<ChildContent>
<AntDesign.FormItem Label="Rate">
<AntDesign.InputNumber Step="0.1" Min="0" @bind-Value="context.Rate" Formatter="RateFormat" />
</AntDesign.FormItem>
<FormItem Label="Date">
<DatePicker TValue="DateTime?" Format="yyyy/MM/dd" @bind-Value="context.Date">
</DatePicker>
</FormItem>
<InputNumberComponent Label="Rate" @bind-Amount="context.Amount"></InputNumberComponent>
<Button Type="primary" HtmlType="submit">Submit</Button>
</ChildContent>
</AntDesign.Form>
</AntDesign.Content>

可以看出，我直接使用@bind Amount将Amount的值绑定到组件。但是，当我单击Submit按钮时，它会触发验证，并在前两个字段上显示验证消息，但不会在子组件上显示。

有指针吗？

Answer 1

我的一位同事帮我找到了答案。我们必须查看FormItem的Ant Design Blazor源代码，以了解发生了什么并得到答案。为了获得验证消息，Ant依赖于EditContext中的验证消息，但使用Any输入控件的FieldIdentifier来检索它们。

FieldIdentifier是Ant使用控件的ValueExpression而不是值创建的。当我们从子控件设置值时，将value作为ValueExpression，反过来，在查找验证消息时，它会根据value而不是实际的模型字段搜索错误消息。

在绑定到子属性时，将ValueExpression设置为绑定表达式可修复此问题。