From 819b77425ab18a2128448d3bc136c50f08ece01a Mon Sep 17 00:00:00 2001
From: Riley Ho <riley@rileychh.dev>
Date: Sun, 8 Dec 2024 14:34:54 +0800
Subject: [PATCH] fix: migrate to Swiper Element from Swiper Vue

Co-authored-by: bessyhuang <bessyhuang1@gmail.com>
---
 components/FlickrCarousel.vue | 9 ++++-----
 1 file changed, 4 insertions(+), 5 deletions(-)

diff --git a/components/FlickrCarousel.vue b/components/FlickrCarousel.vue
index 6bd8ee8..5a9336d 100644
--- 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,7 +23,7 @@ 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 }"
@@ -32,7 +31,7 @@ const images = [image1, image2, image3, image4, image5, image6, image7, image8,
     :space-between="10"
     :speed="500"
   >
-    <SwiperSlide
+    <swiper-slide
       v-for="src in images"
       :key="src"
     >
@@ -40,8 +39,8 @@ const images = [image1, image2, image3, image4, image5, image6, image7, image8,
         alt="Image slide"
         :src="src"
       >
-    </SwiperSlide>
-  </Swiper>
+    </swiper-slide>
+  </swiper-container>
 </template>
 
 <style>