feat: 实现 Redux 全局状态管理事件关注功能
本次提交实现了滚动列表和事件详情的关注按钮状态同步: ✅ Redux 状态管理 - communityDataSlice.js: 添加 eventFollowStatus state - 新增 toggleEventFollow AsyncThunk(复用 EventList.js 逻辑) - 新增 setEventFollowStatus reducer 和 selectEventFollowStatus selector ✅ 组件集成 - DynamicNewsCard.js: 从 Redux 读取关注状态并传递给子组件 - EventScrollList.js: 接收并传递关注状态给事件卡片 - DynamicNewsDetailPanel.js: 移除本地 state,使用 Redux 状态 ✅ Mock API 支持 - event.js: 添加 POST /api/events/:eventId/follow 处理器 - 返回 { is_following, follower_count } 模拟数据 ✅ Bug 修复 - EventDetail/index.js: 添加 useRef 导入 - concept.js: 导出 generatePopularConcepts 函数 - event.js: 添加 /api/events/:eventId/concepts 处理器 功能: - 点击滚动列表的关注按钮,详情面板的关注状态自动同步 - 点击详情面板的关注按钮,滚动列表的关注状态自动同步 - 关注人数实时更新 - 状态在整个应用中保持一致 🤖 Generated with [Claude Code](https://claude.com/claude-code) Co-Authored-By: Claude <noreply@anthropic.com>
This commit is contained in:
@@ -48,10 +48,11 @@ const Community = () => {
|
||||
// Redux状态
|
||||
const { popularKeywords, hotEvents } = useSelector(state => state.communityData);
|
||||
const {
|
||||
data: dynamicNewsEvents,
|
||||
data: allCachedEvents,
|
||||
loading: dynamicNewsLoading,
|
||||
error: dynamicNewsError,
|
||||
pagination: dynamicNewsPagination
|
||||
total: dynamicNewsTotal,
|
||||
cachedCount: dynamicNewsCachedCount
|
||||
} = useSelector(selectDynamicNewsWithLoading);
|
||||
|
||||
// Chakra UI hooks
|
||||
@@ -96,17 +97,20 @@ const Community = () => {
|
||||
};
|
||||
}, [events]);
|
||||
|
||||
// 加载热门关键词、热点事件和动态新闻(使用Redux)
|
||||
// 加载热门关键词和热点事件(动态新闻由 DynamicNewsCard 内部管理)
|
||||
useEffect(() => {
|
||||
dispatch(fetchPopularKeywords());
|
||||
dispatch(fetchHotEvents());
|
||||
dispatch(fetchDynamicNews());
|
||||
}, [dispatch]);
|
||||
|
||||
// 每5分钟刷新一次动态新闻
|
||||
// 每5分钟刷新一次动态新闻(使用 prependMode 追加到头部)
|
||||
useEffect(() => {
|
||||
const interval = setInterval(() => {
|
||||
dispatch(fetchDynamicNews());
|
||||
dispatch(fetchDynamicNews({
|
||||
page: 1,
|
||||
per_page: 10, // 获取最新的10条
|
||||
prependMode: true // 追加到头部,不清空缓存
|
||||
}));
|
||||
}, 5 * 60 * 1000);
|
||||
|
||||
return () => clearInterval(interval);
|
||||
@@ -186,9 +190,10 @@ const Community = () => {
|
||||
{/* 实时要闻·动态追踪 - 横向滚动 */}
|
||||
<DynamicNewsCard
|
||||
mt={6}
|
||||
events={dynamicNewsEvents}
|
||||
allCachedEvents={allCachedEvents}
|
||||
loading={dynamicNewsLoading}
|
||||
pagination={dynamicNewsPagination}
|
||||
total={dynamicNewsTotal}
|
||||
cachedCount={dynamicNewsCachedCount}
|
||||
filters={filters}
|
||||
popularKeywords={popularKeywords}
|
||||
lastUpdateTime={lastUpdateTime}
|
||||
@@ -196,7 +201,6 @@ const Community = () => {
|
||||
onSearchFocus={scrollToTimeline}
|
||||
onEventClick={handleEventClick}
|
||||
onViewDetail={handleViewDetail}
|
||||
mode="grid"
|
||||
/>
|
||||
|
||||
{/* 市场复盘 - 左右布局 */}
|
||||
|
||||
Reference in New Issue
Block a user