Innlegg
Endre en React-inndatingsverdi fra Vanilla Javascript
27. juli 2020 • 1 min lesing
Det korte svaret:
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");
Referanse: https://stackoverflow.com/a/52486921/17360
Det lange svaret:
React overstyrer den opprinnelige Javascript onChange-oppførselen. Å utløse en onChange-hendelse gjør ingenting for å endre inndatingsfeltverdien fra Reacts perspektiv. For React er verdien fortsatt uendret, selv om en bruker tydelig kan se verdien på skjermen. Koden ovenfor utløser endringen i React også.
Forfatter: Chuck Conway er en AI-ingeniør med nesten 30 års erfaring innen programvareutvikling. Han bygger praktiske AI-systemer—innholdspipelines, infrastrukturagenter og verktøy som løser virkelige problemer—og deler det han lærer underveis. Koble til ham på sosiale medier: X (@chuckconway) eller besøk ham på YouTube og på SubStack.