react.dev icon indicating copy to clipboard operation
react.dev copied to clipboard

Clarify portals docs

Open gaearon opened this issue 7 years ago • 2 comments

https://reactjs.org/docs/portals.html

We should make it clearer in the first paragraph it’s not imperative and doesn’t “work” outside of render. There is a common confusion that this should be called in lifecycles (where it has no effect).

gaearon avatar Apr 25 '18 10:04 gaearon

(Moved from #911) — I think we should also include a mention of whether the Portal will take control of the DOM element it receives as container (and, consequently, it needs its own DOM element to render into), similarly to how it's noted for ReactDOM.render(). Clarifying this this can help people avoid creating useless DOM nodes "just in case" — that is, if there aren't any caveats to using, for example, document.body as a target.

Another thing I was momentarily surprised by — although it makes perfect sense — is that if you rely on CSS classes to style an element that you then transport to a different part of the the DOM, it will not inherit styles from its parent React element. Maybe warrants a tiny note?

danburzo avatar May 30 '18 08:05 danburzo

@gaearon can we close this? I think you explained this well in the new docs https://react.dev/reference/react-dom/createPortal

rickhanlonii avatar May 17 '25 18:05 rickhanlonii