¿Es posible obtener el nodo principal del destino del evento en el DOM virtual?
En mi componente de reacción básico, tengo un método que se activa desde el evento onClick, me gustaría obtener las propiedades del nodo DOM virtual principal.
handleClick(e){ // The following code only gives me the actual DOM parent Node ReactDOM.findDOMNode(e.target).parentNode }Sí. React funciona en un modelo DOM virtual y actualizará el DOM del navegador real solo si es necesario. Los eventos en React también funcionan en un DOM virtual y se denominan eventos sintéticos . Si encuentra que necesita el evento de nivel de navegador subyacente por alguna razón, simplemente use el atributo nativeEvent para obtenerlo .
Hay algunas restricciones en React Virtual DOM que puede leer aquí :
Además, esto puede ser útil y explica la diferencia entre Virtual Dom y Browser DOM.
Browser DOM es solo una abstracción de los elementos en la página, y React DOM sería una abstracción de esa abstracción.
El método de render de ReactDOM es crucial en la forma en que enviamos elementos de React al DOM del navegador:
var React = require('react'); var ReactDOM = require('react-dom'); var root = React.createElement('div'); ReactDOM.render(root, document.getElementById('example')); ^ |---- Where React elements from React Virtual DOM enter the Browser DOMEn React estamos tratando con React Elements y React Components.
Dado que React Element es una representación virtual de un DOM Element, para trabajar con los eventos y capturar a los padres, debe crear React Components de cualquiera de estas tres formas:
Para navegar por el padre dentro del evento de clic, por ejemplo, puede marcar esto:
var parent = this._reactInternalInstance._currentElement._owner._instance;REF: ¿hay alguna forma de acceder a la instancia del componente principal en React? y http://jsfiddle.net/BinaryMuse/j8uaq85e/