在 Elementor 中识别对销毁和重新初始化 Swiper 的引用答案

【问题标题】：Identify Reference to Destroy & Re-Initialize Swiper in Elementor在 Elementor 中识别对销毁和重新初始化 Swiper 的引用
【发布时间】：2019-07-29 22:30:20
【问题描述】：

Elementor Pro（WordPress 页面构建器）与 Swiper 完美集成，将其 GUI 与 JS 参数和数据库内容绑定。

但是，对于我的项目，我需要对 Swiper "CoverFlow" skin Init 参数进行一些更改（显示更多幻灯片，更改 3D 效果朝向...）。

我希望使用 Swiper API 的 Destroy method，如下所示：

mySwiper.destroy(deleteInstance, cleanStyles);

然后我可以使用我自己的自定义参数再次初始化 Swiper。挑战在于 Elementor 在 frontend.js 中调用 Swiper 的方式是一个复杂的匿名函数，它并不能真正让我知道“mySwiper”是什么……第 567 行：

this.swipers.main = new Swiper(this.elements.$mainSwiper, this.getSwiperOptions());

如果有人能帮助我理解“this.swipers.main”在 Init 之后将转换为什么，我将不胜感激，这样我就可以销毁 swiper 并用我自己的参数再次初始化它。

显然我无法编辑 frontend.js 本身，因为它是一个需要更新的插件文件。

谁教我如何钓鱼以及在其他类似情况下解决这些类型的谜题的方法是什么。

【问题讨论】：

标签： scope this destroy swiper elementor

【解决方案1】：

您可以为 Elementor 小部件提供一个 ID，例如：slider1，然后您可以使用 JS：

var sliderInstance = document.querySelector('#slider1 .swiper-container').swiper;

之后，您可以随时随地拨打sliderInstance.destroy()。

如果你想再次初始化它，你可以调用：

var sliderInstance = new Swiper('#slider1 .swiper-container', {
    //options
});

【讨论】：

Bingo.. 你整理了我的案子。