Блог

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

Однако для моего проекта мне нужно внести некоторые изменения в параметры инициализации оболочки Swiper «CoverFlow» (показать больше слайдов, изменить направление 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 сам по себе, поскольку это файл плагина, который необходимо обновить.

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

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

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

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

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

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