如何让Blazor输入框仅在填写完成/失焦时调用GetExtensions方法？

要实现仅在输入完成（按下回车）或输入框失去焦点时调用GetExtensions方法，你可以替换掉@oninput事件，改用以下两种事件之一：

1. 使用@onchange事件 #

@onchange会在输入框内容确认变化时触发（比如按下回车、点击输入框外部失焦），刚好匹配你"输入完成"的需求。修改后的代码如下：

<input type="text" class="form-control" name="fileSelector" id="fileSelector" 
    @bind="FileFilter.PathName" 
    @onchange="@(() => GetExtensions(FileFilter.PathName))"/>

因为@bind已经自动同步了FileFilter.PathName和输入框的值，所以在@onchange的回调里直接使用绑定好的属性即可，不需要再从事件参数里取值。

2. 使用@onblur事件 #

如果你只想在输入框失去焦点时触发方法，不管用户是否按下回车，可以用@onblur事件：

<input type="text" class="form-control" name="fileSelector" id="fileSelector" 
    @bind="FileFilter.PathName" 
    @onblur="@(() => GetExtensions(FileFilter.PathName))"/>

两种事件的区别 #

• @onchange：在用户确认输入（回车/失焦）且内容确实发生变化时触发
• @onblur：只要输入框失去焦点就触发，不管内容有没有改变

你可以根据实际需求选择其中一种方案。

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