Hey, I came across this awesome Vue.js image slider on "digitalocean.com" but it seems to only work with images uploaded on platforms like imgbb, pixabay, etc. I tried to use a local image from my assets folder, but it's not working. Can anyone help me out? I've already attempted using the paths ../assets/castelgandolfo.jpg or ./assets/castelgandolfo.jpg Apologies for any language mistakes in my message!
Here is the code snippet:
export default {
name: "Slider",
data() {
return {
images: [
"https://i.ibb.co/6NJ7p6w/Castelgandolfo.jpg",
"https://i.ibb.co/QJN06cG/Grottaferrata.jpg",
"https://i.ibb.co/R3pHtGx/Ariccia.jpg",
],
timer: null,
currentIndex: 0
};
},
mounted: function() {
this.startSlide();
},
methods: {
startSlide: function() {
this.timer = setInterval(this.next, 10000);
},
next: function() {
this.currentIndex += 1;
},
prev: function() {
this.currentIndex -= 1;
}
},
computed: {
currentImg: function() {
return this.images[Math.abs(this.currentIndex) % this.images.length];
}
}
};