View Vue Component

    View Vue component represents Framework7’s View component.

    • - single View-router component
    • f7-views - wrapper element for multiple views used as Tabs

    Swipe-back related events are available only in iOS theme.

    EventDescription
    view:initEvent will be triggered on View initialization
    view:resizeEvent will be triggered on Master Detail resize (when masterDetailResizable enabled)
    swipeback:moveEvent will be triggered during swipe back move
    swipeback:beforechangeEvent will be triggered right before swipe back animation to previous page when you release it
    swipeback:afterchangeEvent will be triggered after swipe back animation to previous page when you release it
    swipeback:beforeresetEvent will be triggered right before swipe back animation to current page when you release it
    swipeback:afterresetEvent will be triggered after swipe back animation to current page when you release it
    tab:showEvent will be triggered when View-Tab becomes visible/active
    tab:hideEvent will be triggered when View-Tab becomes invisible/inactive
    • by accessing .f7View component’s property
    • main view (with main=”true” prop) is always accessible via this.$f7.views.main

    Minimal layout

    Views As Tabs

    With parameters

    ← Treeview