Skip to content

Посты

Изменение значения React Input из обычного Javascript

27 июля 2020 г. • 1 мин чтения

Изменение значения React Input из обычного Javascript

Краткий ответ:

function setNativeValue(element, value) {
    let lastValue = element.value;
    element.value = value;
    let event = new Event("input", { target: element, bubbles: true });
    // React 15
    event.simulated = true;
    // React 16
    let tracker = element._valueTracker;
    if (tracker) {
        tracker.setValue(lastValue);
    }
    element.dispatchEvent(event);
}

var input = document.getElementById("ID OF ELEMENT");
setNativeValue(input, "VALUE YOU WANT TO SET");

Ссылка: https://stackoverflow.com/a/52486921/17360

Подробный ответ:

React переопределяет нативное поведение onChange в Javascript. Запуск события onChange ничего не делает для изменения значения поля ввода с точки зрения React. Для React значение остается неизменным, даже если пользователь может ясно видеть значение на экране. Приведенный выше код также запускает изменение в React.

Автор: Чак Конвей специализируется на разработке программного обеспечения и генеративном ИИ. Свяжитесь с ним в социальных сетях: X (@chuckconway) или посетите его на YouTube.

↑ Наверх

Вам также может понравиться