Popover compontent is used to manage the presentation of content in a popover. You use popovers to present information temporarily. The popover remains visible until the user taps outside of the popover window or you explicitly dismiss it.
Popover Vue component represents Popover component.
<!-- Popover -->
<f7-popover>
<!-- Popover content goes here -->
</f7-popover>Renders to:
<!-- Popover -->
<div class="popover">
<div class="popover-angle"></div>
<div class="popover-content">
<!-- Popover content goes here -->
</div>
</div>Popover component has no any properties
| .open(target, animated) | Open popover around target element |
| .close(animated) | Close popover |
| Event | Description |
|---|---|
| popover:open | Event will be triggered when Popover starts its opening animation |
| popover:opened | Event will be triggered after Popover completes its opening animation |
| popover:close | Event will be triggered when Popover starts its closing animation |
| popover:closed | Event will be triggered after Popover completes its closing animation |
You can control Popover state, open and closing it:
open-popover property (to open it) and close-popover property to close it