DioxusLabs / dioxus

Fullstack app framework for web, desktop, mobile, and more.
https://dioxuslabs.com
Apache License 2.0
21.58k stars 830 forks source link

Portals #628

Open FredrikNoren opened 1 year ago

FredrikNoren commented 1 year ago

Specific Demand

I'm looking for something like React's Portals, but I couldn't find anything in the docs. Not sure if it's available but under a different name or simply not available yet.

Implement Suggestion

Basically the same as what React offers: https://reactjs.org/docs/portals.html

jkelleyrtp commented 1 year ago

Specific Demand

I'm looking for something like React's Portals, but I couldn't find anything in the docs. Not sure if it's available but under a different name or simply not available yet.

Implement Suggestion

Basically the same as what React offers: https://reactjs.org/docs/portals.html

We don't currently have portals as a first-class-feature. But... due to how to we do reconciliation, you can re-parent a div to another div after it's been mounted.

This would work on desktop and web if you used eval to pluck the element by its ID and re-parent it to another div, with another ID.

It might take some trial and error to get it working properly - for starters, you'd want to make sure the portaled div is the only child of its parent, and to get the element properly cleaned up you might have to wire up a hook to remove the element if Dioxus doesn't do it automatically.

We will probably add this feature as a first-class feature in a future release, so we can leave this issue open until then.

FredrikNoren commented 1 year ago

@jkelleyrtp Hm any chance we could get an example of how to do this?