update

src/packages/mobile/components/layouts/view/index.vue

@@ -6,17 +6,17 @@
             </slot>
         </template>
         <template v-else>
-            <slot name="header" :animation="animation"></slot>
+            <slot name="header" :animation="showAnimation"></slot>
             <app-scroll-view :class="['app-view__body', flex && 'flex']">
-                <slot :animation="animation"></slot>
+                <slot :animation="showAnimation"></slot>
             </app-scroll-view>
-            <slot name="footer" :animation="animation"></slot>
+            <slot name="footer" :animation="showAnimation"></slot>
         </template>
     </div>
 </template>
 
 <script lang="ts" setup>
-import { computed } from 'vue'
+import { shallowRef, computed, watch, nextTick } from 'vue'
 import { Loading } from 'vant'
 
 const props = defineProps({
@@ -36,8 +36,19 @@ const props = defineProps({
     },
 })
 
+const showAnimation = shallowRef(false)
 const showLoading = computed(() => {
-    return props.loading ? props.animation : false
+    return props.loading ? showAnimation.value : false
+})
+
+nextTick(() => {
+    showAnimation.value = props.animation
+})
+
+watch(() => props.animation, (status) => {
+    if (!status) {
+        showAnimation.value = false
+    }
 })
 </script>