ragnarlotus / vue-flux

Image slider which comes with 20 cool transitions
https://ragnarlotus.github.io/vue-flux-docs/demos/demos
MIT License
542 stars 49 forks source link

Change images #108

Closed bikedel closed 1 year ago

bikedel commented 1 year ago

Hello

I would like to change images in a flux component.

The rscs contains my images. I would like to assign a new array of images to the flux component while the program is running.

How do I change the rscs so that the flux component loads the new images? I have tried rscs.splice(0, 1, new Img("images/andycap.png")); which changes the array but the flux component is still using the old values.

const rscs = shallowReactive([]);

for (let i = 1; i < 3; i++) { rscs.push(new Img("images/logo" + i + ".png")); }

  <VueFlux
    @click="$refs.layer1_slider1.show('next')"
    class="grid-item-img"
    :transitions="transitions"
    :rscs="rscs"
    :options="options"
    ref="layer1_slider1"
  >
  </VueFlux>

Thanks.

bikedel commented 1 year ago

sorry this is not an issue.

I just did not know how to do it.

I added a key to the component and can now change the rscs array and it is reflected.

Thanks again for your great work!

  <VueFlux
    @click="$refs.layer1_slider1.show('next')"
    class="grid-item-img"
    :transitions="transitions"
    :rscs="rscs"
    :options="options"
    ref="layer1_slider1"
    :key="rscs.length"
  >
  </VueFlux>