Kapitel 4. Innere Versöhnung
Diese Arbeit wurde mithilfe von KI übersetzt. Wir freuen uns über dein Feedback und deine Kommentare: translation-feedback@oreilly.com
Um React wirklich gut zu beherrschen, müssen wir verstehen , was die Funktionen tun. Bis jetzt haben wir JSX und React.createElement verstanden. Wir haben auch das virtuelle DOM einigermaßen detailliert verstanden. In diesem Kapitel wollen wir die praktischen Anwendungen vonReact erkunden und verstehen, was ReactDOM.createRoot(element).render() tut. Wir werden insbesondere untersuchen , wie React sein virtuelles DOM aufbaut und dann das reale DOM durch einen Prozess aktualisiert, der sichAbgleich nennt .
Die Versöhnung verstehen
Um es kurz zu machen: Das virtuelle DOM von React ist ein Entwurf unseres gewünschten UI-Zustands. React nimmt diesen Entwurf und setzt ihn durch einen Prozess namensReconciliation in einer bestimmten Host-Umgebung um; normalerweise ein Webbrowser, aber möglicherweise auch andere Umgebungen wie Shells, native Plattformen wie iOS und Android und mehr.
Betrachte den folgenden Codeschnipsel:
import{useState}from"react";constApp=()=>{const[count,setCount]=useState(0);return(<main><div><h1>Hello,world!</h1><span>Count:{count}</span><buttononClick={()=>setCount(count+1)}>Increment</button></div></main>);};
Dieser Codeschnipsel enthält eine deklarative Beschreibung dessen, was unser UI-Zustand sein soll: ein Baum von Elementen. Sowohl unsere Teammitglieder als auch ...