Определить ссылку на уничтожение и повторную инициализацию Swiper в Elementor

Elementor Pro (конструктор страниц WordPress) прекрасно интегрируется с Swiper, привязывая их графический интерфейс к параметрам JS и содержимое базы данных.

Однако для моего проекта мне нужно внести некоторые изменения в обложку "CoverFlow" Swiper Параметры инициализации (показать больше слайдов, изменить направление ориентации 3D-эффекта ...).

Я надеюсь использовать метод Destroy Swiper API, который выглядит так:

mySwiper.destroy(deleteInstance, cleanStyles);

Затем я могу снова инициализировать Swiper с моими собственными параметрами. Проблема в том, что Elementor вызывает Swiper в frontend.js - это сложная анонимная функция, которая на самом деле не позволяет мне узнать, что такое mySwiper ... В строке 567:

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

Я был бы очень благодарен, если бы кто-нибудь мог помочь мне понять, что "this.swipers.main" будет переводиться после инициализации, чтобы я мог уничтожить swiper и снова инициализировать его с моими собственными параметрами.

Очевидно, я не могу редактировать сам frontend.js, так как это файл подключаемого модуля, который необходимо обновить.

Дополнительные баллы тем, кто учит меня ловить рыбу и методологии решения подобных головоломок для других подобных ситуаций.


person Adal    schedule 07.03.2019    source источник


Ответы (1)


Вы можете присвоить ID виджету Elementor ex: slider1, а затем с помощью JS вы можете использовать:

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

После этого вы можете звонить sliderInstance.destroy() куда хотите.

И если вы хотите снова инициализировать его, вы можете позвонить:

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