框架7 每个视图具有多个列的滑动器

Framework7 Swiper with multiple columns per view

本文关键字:视图 框架      更新时间:2023-09-26

我想有一个图像的"网格"和滑块,让我能够为每个滑块视图有 3 列。因此,每次向上或向下滑动时,都会显示一组新的 3 张图像。

Framework7的滑块怎么可能做到这一点?我试过了

 mySlider2 = myApp.slider('.slider-2', {
    pagination: '',
    spaceBetween: 4,
    slidesPerColumn" 3,
    direction: 'vertical'
});

我想它应该是每行的列或类似的东西,但我无法弄清楚如何做到这一点。

使用结构框架7 自己在每张幻灯片中提供和构建网格。

<!-- Slider container -->
<div class="swiper-container">
    <!-- Slides wrapper -->
    <div class="swiper-wrapper">
        <!-- Slides -->
        <div class="swiper-slide">
            // Build your grid here
        </div>
        ... other slides ...
    </div>
    <!-- Pagination, if required -->
    <div class="swiper-pagination"></div>
</div>

参考 Swiper API 文档,有一个选项可用于定义一次应该可见多少张幻灯片。它被称为slidesPerView而不是slidesPerColumn你想出了什么。