Blazor中@onkeyup触发异常：实现输入时实时调用ConvertUnits()

问题核心在于默认的@bind绑定是延迟更新，只有在输入框失去焦点或按下Enter时才会更新绑定的lengthValue变量，所以你添加的@onkeyup或@oninput触发ConvertUnits()时，拿到的还是旧值，导致看起来没生效。

下面是两种可行的解决方案：

方案一：使用双向绑定的手动控制（推荐） #

通过@bind:get和@bind:set自定义绑定逻辑，在设置值的同时直接触发转换：

<input type="number" 
       class="form-control @(lengthValue <= 0 ? "bg-danger" : "bg-success")" 
       @bind:get="lengthValue" 
       @bind:set="(value) => { lengthValue = value; ConvertUnits(); }" />

这样每次输入时，lengthValue会实时更新，并且立刻调用ConvertUnits()，实现实时转换。

方案二：移除@bind，直接通过@oninput处理 #

如果不想用手动绑定，也可以直接监听@oninput事件，手动解析输入值并更新变量、触发转换：

<input type="number" 
       class="form-control @(lengthValue <= 0 ? "bg-danger" : "bg-success")" 
       value="@lengthValue" 
       @oninput="HandleInput" />

对应的C#函数：

private void HandleInput(ChangeEventArgs e)
{
    if (double.TryParse(e.Value?.ToString(), out var value))
    {
        lengthValue = value;
    }
    else
    {
        // 处理输入非数字的情况，比如设为0
        lengthValue = 0;
    }
    ConvertUnits();
}

为什么原来的代码不生效？ #

默认的@bind语法等价于@bind:get="lengthValue" @bind:set="lengthValue"，而Blazor的默认绑定更新时机是输入框失去焦点或按下Enter，所以即使你在@onkeyup里调用ConvertUnits()，此时lengthValue还没被更新，自然看不到实时转换的效果。

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