Событие React onChange переносит курсор в конец поля ввода ТОЛЬКО в iOS - PullRequest
0 голосов
/ 01 апреля 2019

Я пытаюсь настроить поле ввода в React так, чтобы ввод всегда был в формате 4 алфавита, затем «#», а затем 4 алфавита. Ниже приведен код, который я пробовал (который отлично работает в Windows, но в iOS курсор перемещается в конец при каждом запуске onChange).

Я заметил, что было несколько setState. поэтому я сделал их в одно целое (чтобы избежать многократного повторного рендеринга), и он отлично работал в полях ввода, где допускались только цифры. Но не в поле ввода с этим форматом xxxx # xxxx, я упоминал. Вот как я их кодировал.

onCh = (e) => {
    val = e.target.value;
    let err = (/[^a-zA-Z]/.test(val));
    val = this.getCorrectFormat(val);
    e.target.value = val;
    this.setState({
    isError : err,
    inpVal : val
});
}

<input id='blah' onChange={this.onCh} maxLength='9'/>

Ожидается, что при редактировании между курсором должен остаться курсор и буквы должны быть набраны там же. Но на самом деле курсор перемещается в конец после ввода одной буквы или, если onChange вызван нажатием клавиши Backspace, то курсор также перемещается в конец.

...