修改样式

src/components/o-loading/index.module.less

@@ -1,11 +1,31 @@
-.loading{
-    display: flex;
-    align-items: center;
-    flex-direction: column;
-    justify-content: center;
-    height: 30vh;
-    font-size: 14px;
-    .des{
-        margin-top: 20px;
-    }
-}
+.loading {
+  display: flex;
+  align-items: center;
+  flex-direction: column;
+  justify-content: center;
+  // height: 30vh;
+  font-size: 14px;
+
+  height: 55px !important;
+
+  img {
+    height: 30px;
+    width: 120px;
+    margin-top: 20px;
+    object-fit: contain;
+  }
+
+  .des {
+    margin-top: 20px;
+  }
+}
+
+// .loading {
+//   height: 55px !important;
+
+//   img {
+//     height: 30px;
+//     width: 120px;
+//     margin-top: 20px;
+//   }
+// }

src/components/o-loading/index.tsx

@@ -1,16 +1,20 @@
-import { defineComponent } from 'vue'
-import { Vue3Lottie } from 'vue3-lottie'
-import AstronautJSON from '../o-full-refresh/datas/data.json'
-import styles from './index.module.less'
+import { defineComponent } from 'vue';
+// import { Vue3Lottie } from 'vue3-lottie';
+// import AstronautJSON from '../o-full-refresh/datas/data.json';
+import loading from '../o-full-refresh/datas/loading.gif';
+import styles from './index.module.less';
 
 export default defineComponent({
   name: 'o-loading',
   setup() {
     return () => (
       <div class={styles.loading}>
-        <Vue3Lottie  style={{width: '55px', height: '55px'}} animationData={AstronautJSON}></Vue3Lottie>
-        <div class={styles.des}>加载中</div>
+        {/* <Vue3Lottie
+          style={{ width: '55px', height: '55px' }}
+          animationData={AstronautJSON}></Vue3Lottie> */}
+        <img class={styles.loading} src={loading} />
+        {/* <div class={styles.des}>加载中</div> */}
       </div>
-    )
+    );
   }
-})
+});