Swiper 初始化不起作用（无法读取未定义的属性“推送”）

Question

我想做的事情真的很简单，或者我是这么想的。Swiper.js API 记录了一个布尔参数，该参数init允许禁用刷卡器的自动初始化。

我想做的是像这样在全球范围内定义滑动器：

const carousel = new Swiper(".swiper-container" , {

    freeMode: true,

    slidesPerView: "auto",

    init: false,

});

并在单击卡片时对其进行初始化，如下所示：

$(".card").click(function(){

    carousel.init();

});

这样做的问题是浏览器会抛出错误并且脚本无法运行。这是错误：

无法读取未定义的属性“推送”

我不知道是什么问题，因为Swiper API明确指出，将参数设置init为false后，您可以通过调用手动初始化它carousel.init()

Answer 1

看来我可能已经解决了这个问题。似乎即使您全局声明了 swiper，swiper.js 也无法访问它，因为一些奇怪的原因，所以我找到了一个解决方法。也许这是设计它的方式，但至少对我来说，它没有什么意义。首先，您需要在一个函数中声明您的刷卡器，如下所示：function carouselProperties() {    return new Swiper(".swiper-container", {        init: false,        freeMode: true,        slidesPerView: "auto",    });}之后我们进入应该调用滑动器的函数内部，在本例中是点击事件监听器。$(".card").click(function(){    // Here we define a variable that returns the swiper    const carousel = carouselProperties()    // Afte we define this variable we can finally call the init function    carousel.init();});回顾一下：您定义一个返回滑动器及其属性的函数。您在所有其他需要检索刷卡信息的函数中调用该函数。我希望这能帮助任何和我有同样问题的人。