Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Autoplay not working #188

Open
sandyrewa opened this issue Nov 2, 2022 · 1 comment
Open

Autoplay not working #188

sandyrewa opened this issue Nov 2, 2022 · 1 comment

Comments

@sandyrewa
Copy link

I'm using simple image slider with basic example but autoplay not working and getting error on console

Error image:
This is error image

Example code:

<vueper-slides autoplay>
<vueper-slide v-for="(slide, i) in slides"
    :key="slide.id"
    :title="slide.title"
    :content="slide.content"
    :style="'background-color: ' + colors[i % 4]" />
</vueper-slides>
@martinpokorny
Copy link

martinpokorny commented Dec 12, 2022

Confirmation - happening to me as well. Tried to update to latest, still happening across browsers.

On first init of the component the duration check from slide is crashing on undefined even though the property is clearly set up properly. When I clicked out and then reactivated the component, it suddenly started to work - this is reliably reproducible behaviour, so I created rather hacky and ugly, but still working workaround - should somebody be interested in it:

  1. Put following v-if="slideShowHack" on the vueper-slides component.

  2. And then this slideShowHack is set like this using a watch over the slides:

slides: {
      immediate: true,
      handler() {
        this.slideShowHack = false;
        this.$nextTick(() => {
          this.slideShowHack = true;
        });
      },
},

So it is essentially forcing a re-render / re-init of the entire component whenever slides array changes. Obviously - and I cannot stress this enough - this is very hacky and not exactly pretty, but it's a workaround.

To prevent some blinking that this could lead to on initial render of the parent component, set the default value of slideShowHack to false.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

2 participants