【问题标题】:Determine if element is child of another in React, with consideration for portals确定元素是否是 React 中另一个元素的子元素,并考虑门户
【发布时间】:2020-06-01 12:01:08
【问题描述】:

我目前通过使用 ref 捕获组件的根元素并检查点击目标是否为 root.contains(target) 来确定用户是否点击了子元素。

但是,一些子组件使用 React 门户在 DOM 中组件的根元素之外呈现其内容,即使它们仍然是 React 层次结构中的后代。我知道这个组件层次结构必须保存在某个地方。我是否可以访问它,并简单地确定一个元素是否是另一个元素的“React child”?

【问题讨论】:

  • 尽管门户可以位于 DOM 树中的任何位置,但它在其他方面表现得就像一个普通的 React 子级,因为它甚至会冒泡。您是否想将他们视为孩子?如果是,那么您可以通过自己的方式实现
  • @d-saurabh 你不能按照我的方式做,因为contains 方法直接在 DOM 元素上,React 不会拦截和重新解释。

标签: javascript reactjs dom react-portal


【解决方案1】:

事件冒泡通过两个区域(门户部分和监控部分),可以通过拦截事件来标记。

见:ClickAwayListener Code

【讨论】:

    猜你喜欢
    • 2019-02-12
    • 2017-01-25
    • 1970-01-01
    • 1970-01-01
    • 2018-11-27
    • 2013-05-19
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    相关资源
    最近更新 更多