search

BKWLD / vue-visual

Vue 2 image and video loader supporting lazy loading, background videos, fixed aspect ratios, low rez poster images, transitions, loaders, slotted content and more.
https://bkwld.github.io/vue-visual
MIT License
59 stars 7 forks source link

Don't trigger loading transition if asset already loaded in memory #61

Closed weotch closed 2 years ago

weotch commented 2 years ago

Running into this when using visual instances in vue-ssr-carousel, see https://github.com/BKWLD/vue-ssr-carousel/issues/10

weotch commented 2 years ago

This issue ended up being related to how I have a :key on the picture and video elements. I noticed that Vue is doing some surprising stuff related to reusing component instances when I re-order the slides as part of the looping feature in vue-ssr-carousel.

Specifically, when re-arranging slides, the same Vue Visual instance was used but a different image prop value was passed in. This change was triggering the key and the parent transition. Removing the key made everything feel right again.

In the future, if a component wants to swap the image, the visual instance as a whole should be keyed.