Swiper Vue Component

    Framework7 comes with powerful and most modern touch slider ever - Swiper Slider with super flexible configuration and lot, lot of features.

    Swiper Vue component represents Framework7’s Swiper component.

    • - main swiper element, which contains slides and paginations
    • f7-swiper-slide - a single slide element. Could contain any HTML inside

    Swiper Vue component (<f7-swiper>) has additional slots for custom elements:

    • - element will be inserted right before <div class="swiper-wrapper"> element

    If you use automatic initalization to init Swiper (with init:true prop) and need to use Swiper API you can access its initialized instance by accessing .swiper component’s property.

    Minimal layout

    With all controls

    With additional parameters

    ← Swipeout