Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

React portal: host multiple inside same domNode parent?

React has recently added Portal feature, effectively ripping a sub-tree of virtual DOM out and placing it elsewhere in physical DOM.

render() {
  // React does *not* create a new div. It renders the children into `domNode`.
  // `domNode` is any valid DOM node, regardless of its location in the DOM.
  return ReactDOM.createPortal(
    this.props.children,
    domNode,
  );
}

Documentation is not clear if each portal must live in its own domNode.

NOTE: the current implementation as of 11-Feb-2017 does allow multiple portals hosted inside single domNode. Here's a fork of original CodePlex demo from React's docs, pushing two portals into one parent node:

https://codepen.io/anon/pen/WXYNpE

But is this an implementation quirk, or by design?

like image 409
Oleg Mihailik Avatar asked Nov 29 '17 15:11

Oleg Mihailik


1 Answers

As you can see in mentioned codepen, multiple Portals are appended to domNode (e.g. inside this node). Personally this implementation do not bother me, and as i understand this is by design and not a quirk.

like image 54
Andy Theos Avatar answered Oct 22 '22 10:10

Andy Theos