From 460517c19dc3bd3cc6615393087fe1243945da65 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=E7=A6=BA=E7=8B=A8?= <18119604035@163.com>
Date: Mon, 3 Jul 2023 09:25:29 +0800
Subject: [PATCH] =?UTF-8?q?=E5=AD=A6=E4=B9=A0=E9=AA=A8=E6=9E=B6=E5=B1=8F?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 src/pages/study/index.tsx | 27 +++++++++++++++++++--------
 1 file changed, 19 insertions(+), 8 deletions(-)

diff --git a/src/pages/study/index.tsx b/src/pages/study/index.tsx
index 56693e3..df70d7c 100644
--- a/src/pages/study/index.tsx
+++ b/src/pages/study/index.tsx
@@ -1,5 +1,5 @@
 import { useState, useEffect } from "react";
-import { Image, ProgressBar, SpinLoading } from "antd-mobile";
+import { Image, ProgressBar, Skeleton } from "antd-mobile";
 import styles from "./index.module.scss";
 import { useNavigate } from "react-router-dom";
 import { course } from "../../api/index";
@@ -31,13 +31,24 @@ const StudyPage = () => {
     <div className="main-body">
       <div className={styles["title"]}>最近学习</div>
       <div className={styles["list-box"]}>
-        {loading && (
-          <div
-            style={{ width: "100%", display: "flex", justifyContent: "center" }}
-          >
-            <SpinLoading color="primary" />
-          </div>
-        )}
+        {loading &&
+          Array.from({ length: 2 }).map((_, i) => (
+            <div className={styles["item"]} key={i}>
+              <Skeleton
+                animated
+                style={{
+                  width: 100,
+                  height: 75,
+                  borderRadius: 8,
+                  marginRight: 15,
+                }}
+              />
+              <div className={styles["item-info"]}>
+                <Skeleton animated style={{ width: "100%", height: 21 }} />
+                <Skeleton animated style={{ width: "100%", height: 24 }} />
+              </div>
+            </div>
+          ))}
         {!loading && courses.length === 0 && <Empty></Empty>}
         {/* <div className={styles["label"]}>更早</div> */}
         {!loading &&