PreventDefault на входе Blazor

Вы можете думать немного по-другому в Blazor.

Вместо того, чтобы использовать «bind» и предотвращать нажатие клавиш, вы можете установить «value» и обработать событие «oninput», например:

https: // blazorfiddle. com / s / azdn892n

@page "/"
<h1>Start typing something...</h1>
<input type="text" value="@PetitionInput" oninput="@PetitionHandleKeyDown" />

@functions {
    private int _petitionCharStep = 0;
    private string _petition = "This is a dummy text";
    public string PetitionInput { get; set; } = string.Empty;

    void PetitionHandleKeyDown(UIChangeEventArgs arg) {
        PetitionInput = _petition.Substring(0,++_petitionCharStep);
        Console.WriteLine(PetitionInput);
    }
}

Я не могу представить, почему вы хотели бы сделать это, и там Есть много дополнительных вещей, которые вам нужно сделать, чтобы закрыть пробелы, клавиши со стрелками, вкладки и т.д ...

Следующее предназначено для сбитого с толку, объясняющего, как работает привязка данных в Blazor:

Использование связывания со свойством PetitionInput (<input bind="@PetitionInput" />) по существу эквивалентно следующему:

<input value="@PetitionInput" 
    onchange="@((UIChangeEventArgs __e) => PetitionInput= __e.Value)" />

[ 118] «Когда компонент визуализируется, значение элемента input берется из свойства PetitionInput. Когда пользователь вводит текстовое поле, вызывается событие onchange, а свойству PetitionInput устанавливается измененное значение. В принципе, bind связывает текущее значение выражения с атрибутом значения и обрабатывает изменения с помощью зарегистрированного обработчика. "

Проще говоря, когда вы используете атрибут bind (bind =" @ PetitionInput "), Blazor генерирует код, подобный this:

<input value="@PetitionInput" 
        onchange="@((UIChangeEventArgs __e) => PetitionInput= __e.Value)" />

Это так называемое двустороннее связывание данных. Теперь, если вы добавляете обработчик события для события onkeydown, код выполняет то, для чего он предназначен:

void PetitionHandleKeyDown(UIKeyboardEventArgs arg) {
    PetitionInput += _petition[_petitionCharStep];
    _petitionCharStep++;
}

Когда страница отображается впервые, текстовое поле по умолчанию пустое. Значение PetitionInput установлено в string.Empty:

public string PetitionInput { get; set; } = string.Empty; 

Когда пользователь вводит текстовое поле, скажем, букву «N», он добавляется в свойство PetitionInput из-за двусторонней привязки (с использованием атрибута bind) и отображается в текстовом поле сразу после визуализации компонента размещения. Кроме того, код в методе PetitionHandleKeyDown добавляет букву «T» к свойству PetitionInput (при первом вводе), и, таким образом, строка «NT» отображается в текстовом поле сразу после визуализации компонента размещения. Конечно, способ предотвратить такое поведение (мы должны уважать желание спрашивающего) состоит в том, чтобы сделать то, что
мистер Магу сделал выше. Простой и элегантный, отражающий понимание привязки данных и работы Blazor.

1113 Надеюсь, это поможет ... По крайней мере, я знаю, это помогло мне.

Хорошо, это немного грязно, сложно: удалите последний символ, чтобы переопределить клавишу ввода пользователя:

<input type="text" 
       value="@PetitionInput" 
       onkeydown="@PetitionHandleKeyDown"
       onkeyup="@PetitionHandleKeyUp" 
        />

// ...
private int _petitionCharStep = 0;
private string _petition = "This is a dummy text";
public string PetitionInput { get; set; } = string.Empty;

void PetitionHandleKeyDown(UIKeyboardEventArgs arg) {
    if (_petitionCharStep >= _petition.Length  )
    {
        PetitionInput = _petition.Substring(0, _petition.Length-1 );
        _petitionCharStep--;
    }
}

void PetitionHandleKeyUp(UIKeyboardEventArgs arg) {
    if (_petitionCharStep < _petition.Length  )
    {
        PetitionInput += _petition[_petitionCharStep];
        _petitionCharStep++;
    }        
}

[ 112] Проверьте это на Blazorfiddle.