Vanilla JavascriptからReactの入力値を変更する

簡潔な答え：

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イベントをトリガーしても、Reactの観点からは入力フィールドの値は変わりません。ユーザーには画面に値が表示されているのが見えますが、Reactにとっては値は変わっていないままです。上記のコードはReactでも変更をトリガーします。