如何删除单选按钮上的 mudblazor 键盘导航

Question

如何删除单选按钮上的 mudblazor 键盘导航。

（https://mudblazor.com/components/radio#keyboard-navigation）

我尝试替换

@onkeydown

事件但没有成功，它似乎被键盘导航事件覆盖了。

我希望消除所有键对单选按钮值的影响。

谢谢

Answer 1

您可以尝试使用 js interop e.preventdefault 来禁用键盘事件。

@page "/"
<script>
    window.disableKeyboardInput = (elementId) => {
        document.getElementById(elementId).addEventListener('keydown', function (e) {
            e.preventDefault();  // Disables all keypresses
        });
    };
</script>
<MudForm >
    <MudRadioGroup @bind-Value="SelectedOption" id="myInput">
        <MudRadio Value="@("Radio 1")" Color="Color.Primary">Primary</MudRadio>
        <MudRadio  Value="@("Radio 2")" Color="Color.Secondary">Secondary</MudRadio>
    </MudRadioGroup>
</MudForm>
@code {
    public string SelectedOption { get; set; }
    [Inject] IJSRuntime JSRuntime { get; set; }

    protected override async Task OnAfterRenderAsync(bool firstRender)
    {
        if (firstRender)
        {
            await JSRuntime.InvokeVoidAsync("disableKeyboardInput", "myInput");
        }
    }
 }