猫头鹰旋转木马中的克隆项目

Question

在构建旋转木马时，我意识到猫头鹰添加了克隆的重复项目。我的猫头鹰配置看起来像这样。我该如何阻止这种情况发生。

owlDfe.owlCarousel({
            loop: false,
                        autoWidth:false,
                        nav:false,
                        responsiveClass:true,
                        responsive:{
                            0:{
                                items:sizes.mobile_portrait
                            },
                            568:{
                              items:sizes.mobile_landscape
                            },
                            768:{
                              items:sizes.ipad
                            },
                            800:{
                                items:sizes.desktop
                            },
                            1000:{
                                items:sizes.desktop,
                            }
                        }
          });

Answer 1

我有这个问题 - 我发现将loop选项设置为false可以解决它。

Answer 2

所以，我一直在克服这个克隆问题，将点击事件传递给克隆的幻灯片....

最终为我解决的是设置这两个配置值：

loop: false,

rewind: true

这将允许旋转木马仍然环绕但不重复幻灯片。

Answer 3

jQuery('.owl-carousel2').owlCarousel({
    loop:false,
    margin:10,
    nav:true,
    mouseDrag:false,
    responsive:{
        0:{
            items:1
        },
        600:{
            items:3
        },
        1000:{
            items:3
        }
    }
})

         });

使循环错误，它无法创建克隆项

Answer 4

在我的情况下，我发现，当我添加items: 4，但项目数量少于那个，它将克隆重复。

Answer 5

所有这些答案解决了根本问题但是你不能使用循环:(

我能够通过根据需要更新数据来保留循环和点击行为，这样猫头鹰就不必为我克隆元素。

var toClone = Object.keys(owlConfig.responsive).length - slides;
if(toClone > 0) {
    slides= [...slides, ...slides.splice(0, toClone)];
}
// initialize carousel here