反应事件目标父节点

是否有可能在虚拟DOM上获取事件目标的父节点?

在我的基本反应组件中,我有一个从onClick事件触发的方法,我想获得父虚拟DOM节点属性。

handleClick(e){ 
    // The following code only gives me the actual DOM parent Node
    ReactDOM.findDOMNode(e.target).parentNode 

}

是。 React适用于虚拟DOM模型,并且仅在需要时更新真实的浏览器DOM。 React中的事件也适用于虚拟DOM,它们被称为合成事件。 如果您发现由于某种原因需要基础浏览器级别事件,则只需使用nativeEvent属性即可获取它。

React Virtual DOM中有一些限制,你可以从这里阅读:

此外,这可能会有所帮助,并解释了Virtual Dom和Browser DOM之间的区别。


浏览器DOM仅仅是页面元素的抽象,React DOM将是抽象的抽象。

ReactDOMrender方法至关重要,因为我们将React元素发送到浏览器DOM:

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 DOM

在React中,我们正在处理React Elements和React Components。

由于React元素是DOM元素的虚拟表示,要处理事件并捕获父项,您需要通过以下三种方式创建React组件:

在这里输入图像描述

例如,要导航点​​击事件中的父级,您可以选中以下内容:

 var parent = this._reactInternalInstance._currentElement._owner._instance;

REF:有什么方法可以访问React中的父组件实例? 和http://jsfiddle.net/BinaryMuse/j8uaq85e/

链接地址: http://www.djcxy.com/p/52141.html

上一篇: react event target parent node

下一篇: React Router v4 navigation programmatically