En reaccionar, el elemento es la unidad de construcción más pequeña, un objeto, no un elemento DOM; se puede definir en el código usando jsx, y la sintaxis es "const element =..." El elemento no se puede cambiar después de su creación. Si desea cambiar el DOM, solo puede crear un nuevo elemento.
El entorno operativo de este tutorial: sistema Windows 10, versión de reacción 17.0.1, computadora Dell G3.
Elemento
1.El elemento es la unidad de construcción más pequeña en reacción. Es un objeto, no un DOM, y el costo de creación es relativamente bajo.
(1) Normalmente usamos JSX para definir un elemento en el código:
elemento constante = <h1>Hola mundo</h1>;(2) Utilice ReactDOM.render para renderizar
ReactDOM.render(elemento, document.getElementById('raíz'));2. Una vez creado un Elemento, no se puede cambiar. Es como un fotograma de una película. Si desea cambiar la visualización del DOM, solo puede crear un nuevo Elemento.
3. React comparará los dos Elementos antes y después, y solo actualizará el contenido que necesita ser actualizado.
Amplíe sus conocimientos:
DOM virtual
1. React no construye directamente elementos DOM, sino que crea objetos similares a la estructura DOM. Luego, el DOM real se representa en función de esta estructura, que es React DOM.
2. Cuando haya un cambio, cree un nuevo objeto, compárelo con la estructura anterior y registre la diferencia entre los dos. Puede consultar el algoritmo de diferenciación aquí.
3. Luego, el DOM se actualiza en función de las diferencias registradas.
Elemento de reacción
1. 'DOM' virtual;
2. La esencia es un objeto inmutable;
atributo de tipo: si es una cadena como 'h1', representa un nodo DOM, y su atributo de accesorios es para los atributos del nodo DOM. Si el atributo de tipo es un componente que representa.
función o clase, representa un componente;
3. Los dos tipos de ReactElement se pueden anidar entre sí y mezclar entre sí para describir el árbol DOM;