macOS上MAUI Blazor应用的Input元素与InputText组件键盘事件未触发

在运行于macOS系统的MAUI Blazor应用中，input元素或InputText组件的@onkeydown、@onkeyup、@onkeypress等键盘事件无法触发，但Windows系统上可正常工作。

测试代码如下：

<input @onkeydown="KeydownHandler" @onkeypress="KeyPressHandler" @onkeyup="KeyUpHandler" @onfocus="FocusHandler"/>

@code {
    public string ComboFieldsDimensionsAll_SelectedItem;

    public void KeydownHandler()
    {
    }

    public void KeyPressHandler()
    {
    }

    public void KeyUpHandler()
    {
    }

    public void FocusHandler()
    {
    }
}

重现步骤 #

• 运行MAUI应用
• 聚焦input元素
• 输入任意字母数字键

预期结果 #

每次有效按键时均触发对应键盘事件

实际结果 #

按键输入时无任何键盘事件触发

解决方案1：更新.NET MAUI到最新稳定版本 #

该问题在早期.NET MAUI版本中存在已知兼容性bug，已在后续版本中修复。通过NuGet将项目中的Microsoft.Maui.Controls、Microsoft.Maui.Controls.Compatibility等核心包更新至最新稳定版，可解决大部分此类跨平台事件问题。

解决方案2：调整事件绑定参数与行为 #

macOS上的WebKit WebView对无参数的事件处理函数支持存在差异，同时可显式关闭preventDefault避免事件被系统拦截：

<input @onkeydown="KeydownHandler" @onkeydown:preventDefault="false"
       @onkeyup="KeyUpHandler" @onkeyup:preventDefault="false"
       @onfocus="FocusHandler"/>

@code {
    // 使用带参数的事件处理函数，兼容macOS WebView行为
    public void KeydownHandler(KeyboardEventArgs e)
    {
        // 可通过e.Key获取具体按键信息，编写业务逻辑
    }

    public void KeyUpHandler(KeyboardEventArgs e)
    {
        // 处理逻辑
    }

    public void FocusHandler()
    {
    }
}

注意：@onkeypress已被现代浏览器标准弃用，建议使用@onkeydown或@onkeyup替代。

解决方案3：配置WebView初始化脚本 #

若上述方法无效，可通过自定义WebView初始化脚本强制传递键盘事件：
在项目的Platforms/MacOS/Program.cs中添加以下配置：

builder.Services.Configure<MauiBlazorWebViewOptions>(options =>
{
    options.BlazorWebViewInitializationScript = @"
        // 捕获键盘事件并阻止向上冒泡，确保Blazor能正常接收
        window.addEventListener('keydown', (e) => {
            e.stopPropagation();
        }, true);
        window.addEventListener('keyup', (e) => {
            e.stopPropagation();
        }, true);
    ";
});

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