refactor(mp): 架构重构 — usePageData 统一数据加载 + Store 解耦 + 大页面拆分
新增 usePageData hook(useDidShow 节流 + usePullDownRefresh + loadingRef 防重入 + enabled 条件守卫), 44/58 页面迁移接入,消灭 4 种数据加载模式并存。 - 新增 hooks/usePageData.ts — 统一页面数据加载生命周期 - 新增 stores/index.ts — resetAllStores() 解耦 auth↔health store 依赖 - 新增 pages/index/useHomeData.ts — 首页数据 hook(424→282 行) - 新增 pages/health/useHealthData.ts — 健康页数据 hook(422→254 行) - 44 个页面迁移到 usePageData(9 患者端 + 15 医生端 + 20 子包) - auth store logout 不再直接导入 health store 构建通过,测试 74/75(1 个预存失败)。
This commit is contained in:
70
apps/miniprogram/src/hooks/usePageData.ts
Normal file
70
apps/miniprogram/src/hooks/usePageData.ts
Normal file
@@ -0,0 +1,70 @@
|
||||
import { useRef, useCallback } from 'react';
|
||||
import Taro, { useDidShow, usePullDownRefresh } from '@tarojs/taro';
|
||||
|
||||
interface UsePageDataOptions {
|
||||
throttleMs?: number;
|
||||
enablePullDown?: boolean;
|
||||
enabled?: boolean;
|
||||
}
|
||||
|
||||
interface UsePageDataResult {
|
||||
loading: boolean;
|
||||
refresh: () => Promise<void>;
|
||||
trigger: () => void;
|
||||
}
|
||||
|
||||
export function usePageData(
|
||||
fetcher: () => Promise<void>,
|
||||
options?: UsePageDataOptions,
|
||||
): UsePageDataResult {
|
||||
const throttleMs = options?.throttleMs ?? 5000;
|
||||
const enablePullDown = options?.enablePullDown ?? false;
|
||||
const enabled = options?.enabled ?? true;
|
||||
|
||||
const loadingRef = useRef(false);
|
||||
const lastRunRef = useRef(0);
|
||||
const fetcherRef = useRef(fetcher);
|
||||
fetcherRef.current = fetcher;
|
||||
|
||||
const run = useCallback(async (force = false) => {
|
||||
if (!enabled || loadingRef.current) return;
|
||||
if (!force && Date.now() - lastRunRef.current < throttleMs) return;
|
||||
loadingRef.current = true;
|
||||
lastRunRef.current = Date.now();
|
||||
try {
|
||||
await fetcherRef.current();
|
||||
} finally {
|
||||
loadingRef.current = false;
|
||||
}
|
||||
}, [enabled, throttleMs]);
|
||||
|
||||
useDidShow(() => {
|
||||
run();
|
||||
});
|
||||
|
||||
const trigger = useCallback(() => {
|
||||
run(true);
|
||||
}, [run]);
|
||||
|
||||
const refresh = useCallback(async () => {
|
||||
if (loadingRef.current) return;
|
||||
loadingRef.current = true;
|
||||
lastRunRef.current = Date.now();
|
||||
try {
|
||||
await fetcherRef.current();
|
||||
} finally {
|
||||
loadingRef.current = false;
|
||||
}
|
||||
}, []);
|
||||
|
||||
usePullDownRefresh(async () => {
|
||||
if (!enablePullDown) return;
|
||||
try {
|
||||
await refresh();
|
||||
} finally {
|
||||
Taro.stopPullDownRefresh();
|
||||
}
|
||||
});
|
||||
|
||||
return { loading: loadingRef.current, refresh, trigger };
|
||||
}
|
||||
Reference in New Issue
Block a user