From 79f45b849983e60fde7c7f6e8d1a5284e18c4714 Mon Sep 17 00:00:00 2001
From: jxxghp <jxxghp@gmail.com>
Date: Sun, 27 Apr 2025 12:40:51 +0800
Subject: [PATCH] =?UTF-8?q?=E4=BC=98=E5=8C=96=E8=83=8C=E6=99=AF=E5=9B=BE?=
 =?UTF-8?q?=E7=89=87=E5=88=87=E6=8D=A2=E9=80=BB=E8=BE=91=EF=BC=9A=E6=B7=BB?=
 =?UTF-8?q?=E5=8A=A0=E5=9B=BE=E7=89=87=E9=A2=84=E5=8A=A0=E8=BD=BD=E5=8A=9F?=
 =?UTF-8?q?=E8=83=BD=EF=BC=8C=E7=A1=AE=E4=BF=9D=E5=9B=BE=E7=89=87=E6=88=90?=
 =?UTF-8?q?=E5=8A=9F=E5=8A=A0=E8=BD=BD=E5=90=8E=E5=86=8D=E5=88=87=E6=8D=A2?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/App.vue | 35 ++++++++++++++++++++++++++++++++++-
 1 file changed, 34 insertions(+), 1 deletion(-)

diff --git a/src/App.vue b/src/App.vue
index a09ce456..608d51ac 100644
--- a/src/App.vue
+++ b/src/App.vue
@@ -79,11 +79,44 @@ function startBackgroundRotation() {
 
   if (backgroundImages.value.length > 1) {
     backgroundRotationTimer = setInterval(() => {
-      activeImageIndex.value = (activeImageIndex.value + 1) % backgroundImages.value.length
+      // 计算下一个图片索引
+      const nextIndex = (activeImageIndex.value + 1) % backgroundImages.value.length
+      // 预加载下一张图片
+      preloadImage(backgroundImages.value[nextIndex]).then(success => {
+        // 只有图片成功加载才切换
+        if (success) {
+          activeImageIndex.value = nextIndex
+        }
+      })
     }, 10000) // 每10秒切换一次
   }
 }
 
+// 预加载图片
+function preloadImage(url: string): Promise<boolean> {
+  return new Promise(resolve => {
+    const img = new Image()
+    const imageUrl = getImgUrl(url)
+
+    img.onload = () => resolve(true)
+    img.onerror = () => resolve(false)
+
+    // 设置超时，防止图片长时间加载
+    const timeout = setTimeout(() => {
+      img.src = ''
+      resolve(false)
+    }, 5000) // 5秒超时
+
+    img.src = imageUrl
+
+    // 如果图片已经缓存，onload可能不会触发
+    if (img.complete) {
+      clearTimeout(timeout)
+      resolve(true)
+    }
+  })
+}
+
 // 计算图片地址
 function getImgUrl(url: string) {
   // 使用图片缓存