diff --git a/src/views/Community/hooks/useEventFilters.js b/src/views/Community/hooks/useEventFilters.js index aec3fdd8..7bd6ea95 100644 --- a/src/views/Community/hooks/useEventFilters.js +++ b/src/views/Community/hooks/useEventFilters.js @@ -1,7 +1,7 @@ // src/views/Community/hooks/useEventFilters.js // 事件筛选逻辑 Hook -import { useState, useCallback } from 'react'; +import { useState, useCallback, useRef, useEffect } from 'react'; import { useSearchParams } from 'react-router-dom'; import { logger } from '../../../utils/logger'; import { usePostHogTrack } from '../../../hooks/usePostHogRedux'; @@ -31,78 +31,90 @@ export const useEventFilters = ({ navigate, onEventClick, eventTimelineRef } = { }; }); + // 🔧 使用 ref 存储最新的 filters,避免 useCallback 依赖 filters 导致重新创建 + const filtersRef = useRef(filters); + useEffect(() => { + filtersRef.current = filters; + }, [filters]); + // 更新筛选参数 - 直接替换(由 UnifiedSearchBox 输出完整参数) const updateFilters = useCallback((newFilters) => { + // 🔧 从 ref 读取最新的 filters,避免依赖 filters 状态 + const currentFilters = filtersRef.current; + logger.debug('useEventFilters', '🔄 【接收到onSearch回调】updateFilters 接收到完整参数', { newFilters: newFilters, - oldFilters: filters, + oldFilters: currentFilters, timestamp: new Date().toISOString() }); // 🎯 PostHog 追踪:搜索查询 - if (newFilters.q !== filters.q && newFilters.q) { + if (newFilters.q !== currentFilters.q && newFilters.q) { track(RETENTION_EVENTS.SEARCH_QUERY_SUBMITTED, { query: newFilters.q, category: 'news', - previous_query: filters.q || null, + previous_query: currentFilters.q || null, }); } // 🎯 PostHog 追踪:排序变化 - if (newFilters.sort !== filters.sort) { + if (newFilters.sort !== currentFilters.sort) { track(RETENTION_EVENTS.SEARCH_FILTER_APPLIED, { filter_type: 'sort', filter_value: newFilters.sort, - previous_value: filters.sort, + previous_value: currentFilters.sort, }); } // 🎯 PostHog 追踪:重要性筛选 - if (newFilters.importance !== filters.importance) { + if (newFilters.importance !== currentFilters.importance) { track(RETENTION_EVENTS.SEARCH_FILTER_APPLIED, { filter_type: 'importance', filter_value: newFilters.importance, - previous_value: filters.importance, + previous_value: currentFilters.importance, }); } // 🎯 PostHog 追踪:时间范围筛选 - if (newFilters.date_range !== filters.date_range && newFilters.date_range) { + if (newFilters.date_range !== currentFilters.date_range && newFilters.date_range) { track(RETENTION_EVENTS.SEARCH_FILTER_APPLIED, { filter_type: 'date_range', filter_value: newFilters.date_range, - previous_value: filters.date_range || null, + previous_value: currentFilters.date_range || null, }); } // 🎯 PostHog 追踪:行业筛选 - if (newFilters.industry_code !== filters.industry_code && newFilters.industry_code) { + if (newFilters.industry_code !== currentFilters.industry_code && newFilters.industry_code) { track(RETENTION_EVENTS.SEARCH_FILTER_APPLIED, { filter_type: 'industry', filter_value: newFilters.industry_code, - previous_value: filters.industry_code || null, + previous_value: currentFilters.industry_code || null, }); } setFilters(newFilters); logger.debug('useEventFilters', '✅ setFilters 已调用 (React异步更新中...)'); - }, [filters, track]); + }, [track]); // ✅ 只依赖 track,不依赖 filters // 处理分页变化 const handlePageChange = useCallback((page) => { + // 🔧 从 ref 读取最新的 filters + const currentFilters = filtersRef.current; + // 🎯 PostHog 追踪:翻页 track(RETENTION_EVENTS.NEWS_LIST_VIEWED, { page, filters: { - sort: filters.sort, - importance: filters.importance, - has_query: !!filters.q, + sort: currentFilters.sort, + importance: currentFilters.importance, + has_query: !!currentFilters.q, }, }); // 保持现有筛选条件,只更新页码 - updateFilters({ ...filters, page }); - }, [filters, updateFilters, track]); + updateFilters({ ...currentFilters, page }); + }, [updateFilters, track]); // ✅ 移除 filters 依赖 // 处理事件点击 const handleEventClick = useCallback((event) => {