Messagebar Vue Component

• Messagebar Methods
• Messagebar Slots
• Examples

Messagebar Vue component represents Framework7’s component.

• - main messagebar element
• **f7-messagebar-sheet** - messagebar sheet element
• **f7-messagebar-sheet-image** - messagebar sheet image item
• **f7-messagebar-attachments** - messagebar attachments element
• **f7-messagebar-attachment** - single messagebar attachment element

Messagebar Properties

Messagebar Events

• - element will be inserted in the end of <div class="toolbar-inner">. element
• **before-area** - element will be inserted right before textarea. Messagebar attachments go here
• **after-area** - element will be inserted right after textarea
• **send-link** - element will be inserted inside of send link
• **before-inner** - element will be inserted right before <div class="toolbar-inner">. element
• - element will be inserted right after <div class="toolbar-inner">. element. Messagebar sheet goes here
• **inner-end** - element will be inserted in the end of <div class="toolbar-inner">. element. Same as default slot

Renders to:

Access To Messagebar Instance

Here is how the full example of Messages page where it can be used together with Messages: