multiple carousels on single page - autoplayTimeout out of sync

[kopitar]

Is there any way to make multiple carousel components autoplay/change slides at the same time? I have 8 carousel components on a single page and they are not sliding in synch.

Is there a way to disable the autoplay and instead of that programmaticaly trigger next slide on all carousel components every X seconds?

this is what i'm working with , fresh data is being fetched in intervals via websockets

Each of the 8 boxes has a carousel component :

            <carousel :per-page="1" :mouse-drag="false" :paginationEnabled="false" :autoplay="true" :loop="true" :autoplayTimeout="5000" @page-change="pager">
                <slide v-bind:key="index" v-for="(line, index) in data.lines">
                    <div class="route-table-body">
                        <div class="route-table-tr" v-bind:key="ind" v-for="(tr, ind) in line">
                            <div class="route-table-td">
                            {{ tr.consignee_name }}
                            </div>
                            <div class="route-table-td">
                                {{ tr.te_count }}
                            </div>
                            <div class="route-table-td">
                            {{ $t('waybills.status.' + tr.status )}}
                            </div>
                        </div>
                    </div>
                </slide>
            </carousel> 

[kopitar]

Solved:

<carousel ref="carousel" :per-page="1" :mouse-drag="false" :paginationEnabled="false" :autoplay="false" :loop="true" @page-change="pager"> ......

created() {
    this.pageInterval = setInterval(() => {
        for(let i=0; i < this.$children.length; i++) {
            let c = this.$children[i].$refs.carousel;
            if (typeof c != 'undefined') {
                c.advancePage();
            }
        }
        
    }, 5000);
},