You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
Platform/Target and Browser Versions: Tested on MacOS BigSur 11.3.1 with Safari 14.1 (16611.1.21.161.6), Chrome 90.0.4430.212 and Firefox 88.0.1
What You Did
I try to create an online calendar using Framework7, swiper and svelte. I want to create an infinite calendar where the next day gets loaded as soon as the first or last slide is active.
In the codesandbox demo, when you swipe two times, so that a new slide gets prepended, the component gets rerendered with wrong properties and therefore show the wrong day. But if I skip the svelte component and include its source code directly in the slider, everything works as expected. You can comment out the svelte component on line 115 and uncomment the div on line 113 to test this behaviour.
The problem occurs only if the slideTo method is called. When I append the slides, which does not call the slideTo method, everything works just fine.
Expected Behavior
I expect that svelte components get rendered correctly when prepending them in a slide.
Actual Behavior
The svelte component gets rendered with wrong properties.
The text was updated successfully, but these errors were encountered:
The new slide is unshifted to swiper.virtual.slides.
swiper.virtual.update(true) is called.
swiper.slideTo() is called to get to the new index.
I have implemented this behaviour in the prependDate function on line 46, but skipped the slideTo call.
You can see that when you click on the prepend button when you are on the first slide, nothing gets rerendered. If then the slideTo method is called inside the prependSlide method, the swiper goes 'back' to the next slide, because the new slide is not rendered yet.
But if you skip the slideTo call and swipe forward a few times to force a rerender and then swipe back, you can see that the new slide gets rendered correctly.
So the problem is that the new slides do not get rendered when prepending a slide, and not an issue in the slideTo method as I initially thought.
Here in Svelte, you shouldn't use swiper.virtual.prependSlide/appendSlide methods, you should just modify your initial virtualSlide array with push/unshift but I see it also have some issue
What You Did
I try to create an online calendar using Framework7, swiper and svelte. I want to create an infinite calendar where the next day gets loaded as soon as the first or last slide is active.
https://codesandbox.io/s/swiper-svelte-fork-forked-r2z7p?file=/App.svelte
In the codesandbox demo, when you swipe two times, so that a new slide gets prepended, the component gets rerendered with wrong properties and therefore show the wrong day. But if I skip the svelte component and include its source code directly in the slider, everything works as expected. You can comment out the svelte component on line 115 and uncomment the div on line 113 to test this behaviour.
The problem occurs only if the
slideTo
method is called. When I append the slides, which does not call theslideTo
method, everything works just fine.Expected Behavior
I expect that svelte components get rendered correctly when prepending them in a slide.
Actual Behavior
The svelte component gets rendered with wrong properties.
The text was updated successfully, but these errors were encountered: