perf(CompanyOverview): hooks 支持 enabled 延迟加载和刷新
- 所有 hooks 参数改为 options 对象形式 - 新增 enabled 参数支持延迟加载 - 新增 refreshKey 参数支持手动刷新 - 智能初始化 loading 状态,避免首次渲染闪现空状态 🤖 Generated with [Claude Code](https://claude.com/claude-code) Co-Authored-By: Claude <noreply@anthropic.com>
This commit is contained in:
@@ -11,6 +11,13 @@ interface ApiResponse<T> {
|
||||
data: T;
|
||||
}
|
||||
|
||||
// 支持延迟加载的配置选项
|
||||
interface UseManagementDataOptions {
|
||||
stockCode?: string;
|
||||
/** 是否启用数据加载,默认 true */
|
||||
enabled?: boolean;
|
||||
}
|
||||
|
||||
interface UseManagementDataResult {
|
||||
management: Management[];
|
||||
loading: boolean;
|
||||
@@ -18,16 +25,23 @@ interface UseManagementDataResult {
|
||||
}
|
||||
|
||||
/**
|
||||
* 管理团队数据 Hook
|
||||
* @param stockCode - 股票代码
|
||||
* 管理团队数据 Hook(支持延迟加载)
|
||||
* @param options - 配置选项
|
||||
* @param options.stockCode - 股票代码
|
||||
* @param options.enabled - 是否启用数据加载,默认 true
|
||||
*/
|
||||
export const useManagementData = (stockCode?: string): UseManagementDataResult => {
|
||||
export const useManagementData = (options: UseManagementDataOptions): UseManagementDataResult => {
|
||||
const { stockCode, enabled = true } = options;
|
||||
|
||||
const [management, setManagement] = useState<Management[]>([]);
|
||||
const [loading, setLoading] = useState(false);
|
||||
const [loading, setLoading] = useState(() => enabled && !!stockCode);
|
||||
const [error, setError] = useState<string | null>(null);
|
||||
// 记录是否已完成首次加载,用于派生 loading 状态
|
||||
const [hasLoaded, setHasLoaded] = useState(false);
|
||||
|
||||
useEffect(() => {
|
||||
if (!stockCode) return;
|
||||
// 只有 enabled 且有 stockCode 时才请求
|
||||
if (!enabled || !stockCode) return;
|
||||
|
||||
const controller = new AbortController();
|
||||
|
||||
@@ -52,12 +66,17 @@ export const useManagementData = (stockCode?: string): UseManagementDataResult =
|
||||
setError("网络请求失败");
|
||||
} finally {
|
||||
setLoading(false);
|
||||
setHasLoaded(true);
|
||||
}
|
||||
};
|
||||
|
||||
loadData();
|
||||
return () => controller.abort();
|
||||
}, [stockCode]);
|
||||
}, [stockCode, enabled]);
|
||||
|
||||
return { management, loading, error };
|
||||
// 派生 loading 状态:enabled 但尚未完成首次加载时,视为 loading
|
||||
// 这样可以在渲染时同步判断,避免 useEffect 异步导致的空状态闪烁
|
||||
const isLoading = loading || (enabled && !hasLoaded && !error);
|
||||
|
||||
return { management, loading: isLoading, error };
|
||||
};
|
||||
|
||||
Reference in New Issue
Block a user