update pay ui

src/views/StockOverview/components/HotspotOverview/hooks/useHotspotData.js

@@ -2,7 +2,7 @@
  * 热点概览数据获取 Hook
  * 负责获取指数分时数据和概念异动数据
  */
-import { useState, useEffect, useCallback } from 'react';
+import { useState, useEffect, useCallback, useRef } from 'react';
 import { logger } from '@utils/logger';
 
 /**
@@ -14,19 +14,36 @@ export const useHotspotData = (selectedDate) => {
   const [error, setError] = useState(null);
   const [data, setData] = useState(null);
 
-  const fetchData = useCallback(async () => {
+  // 用于防止 React StrictMode 下的双重请求
+  const fetchingRef = useRef(false);
+  const lastDateRef = useRef(null);
+
+  const fetchData = useCallback(async (forceRefetch = false) => {
+    // 获取日期字符串用于比较
+    const dateStr = selectedDate ? selectedDate.toISOString().split('T')[0] : 'today';
+
+    // 如果正在请求中，或者日期未变化且不是强制刷新，跳过
+    if (fetchingRef.current && !forceRefetch) {
+      return;
+    }
+    if (lastDateRef.current === dateStr && data && !forceRefetch) {
+      return;
+    }
+
+    fetchingRef.current = true;
     setLoading(true);
     setError(null);
 
     try {
       const dateParam = selectedDate
-        ? `?date=${selectedDate.toISOString().split('T')[0]}`
+        ? `?date=${dateStr}`
         : '';
       const response = await fetch(`/api/market/hotspot-overview${dateParam}`);
       const result = await response.json();
 
       if (result.success) {
         setData(result.data);
+        lastDateRef.current = dateStr;
       } else {
         setError(result.error || '获取数据失败');
       }
@@ -35,8 +52,9 @@ export const useHotspotData = (selectedDate) => {
       setError('网络请求失败');
     } finally {
       setLoading(false);
+      fetchingRef.current = false;
     }
-  }, [selectedDate]);
+  }, [selectedDate, data]);
 
   useEffect(() => {
     fetchData();
@@ -46,7 +64,7 @@ export const useHotspotData = (selectedDate) => {
     loading,
     error,
     data,
-    refetch: fetchData,
+    refetch: () => fetchData(true),
   };
 };