Vanilla Javascript से React Input Value को बदलना

संक्षिप्त उत्तर:

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 मूल Javascript onChange व्यवहार को ओवरराइड करता है। onChange event को ट्रिगर करने से React की नज़र में input field value बदलने में कोई मदद नहीं मिलती। React के लिए value अभी भी अपरिवर्तित है, भले ही उपयोगकर्ता को स्क्रीन पर value स्पष्ट रूप से दिखाई दे। उपरोक्त कोड React में भी परिवर्तन को ट्रिगर करता है।