fix: migrate to Swiper Element from Swiper Vue

Co-authored-by: bessyhuang <[email protected]>
COSCUP · Dec 8, 2024 · 819b774 · 819b774
1 parent 6d34255
commit 819b774
Showing 1 changed file with 4 additions and 5 deletions.
diff --git a/components/FlickrCarousel.vue b/components/FlickrCarousel.vue
@@ -1,5 +1,4 @@
 <script setup>
-import { Swiper, SwiperSlide } from 'swiper/vue'
 import 'swiper/css'
 import 'swiper/swiper-bundle.css'
 import { register } from 'swiper/element/bundle'
@@ -24,24 +23,24 @@ const images = [image1, image2, image3, image4, image5, image6, image7, image8,
 </script>
 
 <template>
-  <Swiper
+  <swiper-container
     :autoplay="{ delay: 2500, disableOnInteraction: false }"
     :loop="true"
     :pagination="{ clickable: true }"
     :slides-per-view="3"
     :space-between="10"
     :speed="500"
   >
-    <SwiperSlide
+    <swiper-slide
       v-for="src in images"
       :key="src"
     >
       <img
         alt="Image slide"
         :src="src"
       >
-    </SwiperSlide>
-  </Swiper>
+    </swiper-slide>
+  </swiper-container>
 </template>
 
 <style>