ui:portal
This ViewHelper allows you to render content in a different part of the DOM tree than where it is defined. This is particularly useful for modals, tooltips, or any component that needs to break out of its parent container for styling or positioning reasons.
You need to use this ViewHelper in conjunction with the ui:portalContainer ViewHelper, which acts as the target container for all portalled content.
Example
Common use case inside Tooltip/Content.html
:
<ui:portal>
<primitives:tooltip.positioner>
<primitives:tooltip.content>
<primitives:tooltip.arrow />
<f:slot />
</primitives:tooltip.content>
</primitives:tooltip.positioner>
</ui:portal>
Arguments
Name | Type | Description | Required | Default |
---|---|---|---|---|
name |
string | The name of the target container | No | 'default' |