如何在MudBlazor的MudNumericField中监听增减事件并处理数值？

问题场景 #

我在MudBlazor项目中使用MudNumericField组件，设置Step值为0.5M，仅允许0.5、1.0、1.5这类数值。用户手动输入1.23这类值时会显示错误，这符合预期。但如果用户输入1.23后点击鼠标上下箭头，新值会变为1.73或0.73（即1.23±0.5），这并非我想要的效果。我希望每次增减后将数值四舍五入到最近的0.5倍数，例如从1.23变为1.5而非1.73。

我发现OnKeyUp和OnKeyDown事件仅对键盘交互有效，对点击微调按钮（spinner buttons）无效。作为MudBlazor新手，想知道是否可以监听MudNumericField的增减事件，从而应用自定义的四舍五入逻辑？

原代码示例：

<MudNumericField
T="decimal"
@bind-Value="@Days"
Label="Days"
Variant="@Variant.Text"
Min="0.5M"
Max="100"
Step="0.5M"
Error="@(!IsDaysMultipleOfHalf)"
/>

解决方案 #

放弃@bind-Value的语法糖，手动拆分Value和ValueChanged事件，在数值变更时强制修正到最近的0.5倍数，覆盖所有交互场景（包括微调按钮点击）。

步骤1：编写数值修正逻辑 #

在代码块中定义变量和处理方法：

private decimal Days { get; set; } = 0.5M;

// 验证数值是否为0.5的倍数（处理浮点精度误差）
private bool IsDaysMultipleOfHalf => Math.Abs(Days % 0.5M) < 0.0001M;

private void OnDaysChanged(decimal newValue)
{
    // 四舍五入到最近的0.5倍数
    var roundedValue = Math.Round(newValue * 2) / 2;
    // 确保数值在Min和Max范围内
    Days = Math.Clamp(roundedValue, 0.5M, 100M);
}

步骤2：修改组件绑定 #

将@bind-Value拆分为Value和ValueChanged：

<MudNumericField
T="decimal"
Value="@Days"
ValueChanged="@OnDaysChanged"
Label="Days"
Variant="@Variant.Text"
Min="0.5M"
Max="100"
Step="0.5M"
Error="@(!IsDaysMultipleOfHalf)"
/>

效果说明 #

• 无论点击微调按钮、键盘输入还是粘贴数值，都会触发ValueChanged事件，自动将数值修正为最近的0.5倍数
• 保留原有的错误提示逻辑，手动输入非0.5倍数的值时仍会显示错误
• 修正后的数值会自动限制在Min和Max设定的范围内

内容的提问来源于stack exchange，提问作者Swati Chandra