在我的vue-app 中，我有一個鏈接串列，我希望按照默認時間間隔自動逐個觸發，假設 3 秒后，第一個鏈接被觸發，然后再過 3 秒，鏈接 2 被觸發。 . 所以它是一種帶有我想要實作的鏈接的輪播/自動播放，但我真的不知道如何解決這個問題。
這是我的代碼：
<li v-for="(slide, index) in slides" :key="index" :class="slideIndex === index ? 'active' : ''" @click="slideIndex = index" ref="slide">
{{ slide.title }}
</li>
然后我想到了這樣的事情：
mounted() {
Object.keys(this.$refs.slide).forEach((el) => {
setInterval(() => {
this.$refs.slide[el].click();
}, 3000);
});
},
但這會觸發所有鏈接并且似乎根本不正確，但這只是一個小想法......
有人可以幫我嗎？
uj5u.com熱心網友回復：
我不建議通過模擬單擊鏈接來執行此操作。
如何在代碼中設定要激活的元素？
我假設slideIndex是當前選定的幻燈片？
你可以嘗試這樣的事情：
setInterval(() => {
this.slideIndex = this.slideIndex < this.slides.length - 1 ? (this.slideIndex = 1) : 0;
}, 3000);
因此，每次觸發間隔并回圈播放幻燈片時，您都會添加 1。如果它在最后slideIndex被重置并從 00 開始
轉載請註明出處，本文鏈接：https://www.uj5u.com/net/338537.html
標籤：javascript Vue.js
上一篇：好奇如何定位多個具有相同功能的類