layout: 更新 App 组件结构- 在 App 组件中添加 client-only 组件，以优化客户端渲染

- 调整 VanConfigProvider 和 NuxtLayout 的嵌套结构
2025-02-20 15:18:39 +08:00 · 2025-02-20 15:18:39 +08:00 · 548e2b697a
commit 548e2b697a
parent 85f81d287e
1 changed files with 9 additions and 7 deletions
--- a/app/app.vue
+++ b/app/app.vue
@ -39,15 +39,17 @@ provide('slideDirection', slideDirection)
 </script>

 <template>
-  <VanConfigProvider>
-    <NuxtLoadingIndicator
-        color="repeating-linear-gradient(to right,var(--c-primary) 0%,var(--c-primary-active) 100%)"/>
-    <NuxtLayout>
-      <NuxtPage :transition="{
+  <client-only>
+    <VanConfigProvider>
+      <NuxtLoadingIndicator
+          color="repeating-linear-gradient(to right,var(--c-primary) 0%,var(--c-primary-active) 100%)"/>
+      <NuxtLayout>
+        <NuxtPage :transition="{
        name: slideDirection
      }"/>
-    </NuxtLayout>
-  </VanConfigProvider>
+      </NuxtLayout>
+    </VanConfigProvider>
+  </client-only>
 </template>

 <style>