Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

How i can destroy and reinit slider?

See original GitHub issue

I need use slider, only on mobile devices. How i can destroy, and after reinit slider? Im trying destroy this.sliderZimmer.destroy(true, true) and slider destroying fine. But if after i try to init this.sliderZimmer.init(). Script give me an error.

Issue Analytics

State:
Created 4 years ago
Comments:5 (1 by maintainers)

Top GitHub Comments

2reactions

surmon-chinacommented, Mar 24, 2020

The author of Swiper has stated Swiper does not support this action:

“You need to recreate instance with calling new Swiper, swiper.init() won’t have effect after destroying”

I recommend using v-if to control the destruction and initialization of Swiper inside the component.

e.g.:

<swiper v-if="renderSwiper">

shouldBeDestroy() {
  this.renderSwiper = false
},
shouldBeWork() {
  this.renderSwiper = true
}

0reactions

TakCastelcommented, Oct 8, 2020

Destroying the swiper doesn’t mean making it disappear, we could still need to display the slides; without the swiper behavior.

Top Results From Across the Web

iDangerous Swiper, subsequent destroy() and reInit() methods

I suspect the solution probably does involve a destroy() call, but I'm having a hard time seeing how this would work for a...

Swiper :: How to destroy/ReInitialize with 0 slides #502 - GitHub

1. Your clear previous images in gallery, not sure how you do it, but you can do that with $('.swiper-wrapper').html(' ...

Slick slider destroy and reinit

Slick slider destroy and reinit. The best way is you should destroy the slick slider after reinitializing it. Slick slider acessability.

Swiper Hide Problem (Destroy & Re-create) Basic - CodePen

1. //Swiper Initialization ; 2. new Swiper('.swiper-container', { ; 3. // Optional parameters ; 4. observer: true, ; 5. observeParents: true,.

slick destroy - CodeSandbox

import $ from "jquery"; · import debounce from "lodash.debounce"; · import "slick-carousel"; · $(".carousel") ·.on("destroy", function(_, slick) { · const reinit = ...