Blazor中InputText的@bind-Value回车时无法及时更新值的问题

Blazor 的 @bind-Value 默认会在输入元素失去焦点或按键抬起后才同步更新绑定的字段值。而你用的 @onkeydown 是在按键按下的瞬间触发事件，此时输入框的最新内容还没同步到 _searchTerm，所以调用搜索时返回的是旧值。点击按钮时，输入框早已完成值的同步，因此功能正常。

方案一：改用 @onkeyup 事件（最简单） #

将输入框的 @onkeydown 替换为 @onkeyup，这样按键抬起时，输入框内容已经同步到 _searchTerm，触发搜索就能拿到最新值：

@using System.Runtime.CompilerServices
<div class="row">
    <div class="col-10">
        <!-- 把 @onkeydown 改成 @onkeyup -->
        <InputText id="searchTerm" @onkeyup="@Enter" @bind-Value="_searchTerm" class="form-control" placeholder=" " />
    </div>
    <div class="col-2">
        <button class="btn btn-primary" @onclick="TriggerSearch">Search</button>
    </div>
</div>

@code {
    [Parameter]
    public EventCallback<string?> OnSearchTriggerd { get; set; }

    private string? _searchTerm;

    private async Task TriggerSearch()
    {
        await OnSearchTriggerd.InvokeAsync(_searchTerm);
    }

    private async Task Enter(KeyboardEventArgs e)
    {
        if (e.Code == "Enter" || e.Code == "NumpadEnter")
        {
            await TriggerSearch();
        }
    }
}

方案二：直接获取输入框当前值（更可靠） #

通过 ElementReference 直接读取输入框的 DOM 值，不依赖绑定同步时机，确保每次都拿到最新内容：

@using System.Runtime.CompilerServices
<div class="row">
    <div class="col-10">
        <!-- 添加 @ref 引用输入框 -->
        <InputText @ref="searchInput" id="searchTerm" @onkeydown="@Enter" @bind-Value="_searchTerm" class="form-control" placeholder=" " />
    </div>
    <div class="col-2">
        <button class="btn btn-primary" @onclick="TriggerSearch">Search</button>
    </div>
</div>

@code {
    [Parameter]
    public EventCallback<string?> OnSearchTriggerd { get; set; }

    private string? _searchTerm;
    // 定义输入框的引用
    private ElementReference searchInput;

    private async Task TriggerSearch()
    {
        await OnSearchTriggerd.InvokeAsync(_searchTerm);
    }

    private async Task Enter(KeyboardEventArgs e)
    {
        if (e.Code == "Enter" || e.Code == "NumpadEnter")
        {
            // 直接读取输入框的当前值
            var currentValue = await searchInput.GetAttributeAsync("value");
            await OnSearchTriggerd.InvokeAsync(currentValue);
        }
    }
}

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