diff --git a/.workbuddy/memory/2026-07-01.md b/.workbuddy/memory/2026-07-01.md index 1934e55..947d0ff 100644 --- a/.workbuddy/memory/2026-07-01.md +++ b/.workbuddy/memory/2026-07-01.md @@ -62,3 +62,10 @@ - 修复 `OrderCard.getCardStatus` 状态判断顺序 bug: - 旧逻辑:先判 `deliveryStatus=30` → "待收货",导致 `orderStatus=1` 的"已完成"订单状态栏错显示"待收货" - 新逻辑:`orderStatus=1`(已完成)作为终态最先判断;`deliveryStatus=30` 单独显示"已收货"(绿色),与"待收货"(蓝色)区分 + +## 用户页面数据加载优化 + +- `src/pages/user/user.tsx`:优化余额/积分/优惠券/订单统计数据加载体验 + - 给 `useRequest` 添加 `cacheKey` + `cacheTime=30s`,30s 内重复返回页面直接展示缓存数据 + - 用骨架屏(`animate-pulse`)替代 `...` 占位符,只在无缓存数据时显示骨架 + - 有缓存数据时瞬间渲染,后台静默刷新 diff --git a/src/pages/user/user.tsx b/src/pages/user/user.tsx index 095e6f6..b0fa1e4 100644 --- a/src/pages/user/user.tsx +++ b/src/pages/user/user.tsx @@ -17,15 +17,18 @@ const UserPage: React.FC = () => { const [storeInfo, setStoreInfo] = useState(null) // 获取用户卡片统计(余额/积分/优惠券/礼品卡) + // 使用 cacheKey 缓存 30s,页面返回时先显示缓存数据再静默刷新 const { data: cardStats, run: runCardStats, loading: cardStatsLoading } = useRequest(getUserCardStats, { manual: true, - refreshDeps: [isLoggedIn] + cacheKey: 'user_card_stats', + cacheTime: 30 * 1000, }) - // 获取用户订单统计 + // 获取用户订单统计(缓存 30s,先缓存后静默刷新) const { data: orderStats, run: runOrderStats, loading: orderStatsLoading } = useRequest(getUserOrderStats, { manual: true, - refreshDeps: [isLoggedIn] + cacheKey: 'user_order_stats', + cacheTime: 30 * 1000, }) // 登录后加载数据 @@ -45,6 +48,7 @@ const UserPage: React.FC = () => { // 先从 storage 快速同步,立即更新 UI(无网络延迟) const hasUser = syncFromStorage() if (hasUser) { + // 使用缓存:30s 内重复返回页面直接展示缓存数据,无需重新请求 runCardStats() runOrderStats() // 刷新门店关联 @@ -77,6 +81,10 @@ const UserPage: React.FC = () => { const loading = cardStatsLoading || orderStatsLoading + // 是否有可用数据(缓存或请求结果),用于判断是否需要骨架屏 + const hasCardData = !!cardStats + const hasOrderData = !!orderStats + // 下拉刷新状态 const [refreshing, setRefreshing] = useState(false) @@ -118,8 +126,8 @@ const UserPage: React.FC = () => { {isLoggedIn && ( Taro.navigateTo({ url: '/pages/user/wallet' })}> - {loading ? ( - ... + {!hasCardData ? ( + ) : ( {cardStats?.balance || '0.00'} @@ -128,8 +136,8 @@ const UserPage: React.FC = () => { 余额 Taro.navigateTo({ url: '/pages/user/points-record' })}> - {loading ? ( - ... + {!hasCardData ? ( + ) : ( {cardStats?.points || (user as any)?.points || 0} @@ -138,8 +146,8 @@ const UserPage: React.FC = () => { 积分 Taro.navigateTo({ url: '/pages/user/coupon-list' })}> - {loading ? ( - ... + {!hasCardData ? ( + ) : ( {cardStats?.coupons || 0}