feat: 删除md文件
This commit is contained in:
@@ -1,841 +0,0 @@
|
||||
# PostHog 事件追踪实施总结
|
||||
|
||||
## ✅ 已完成的追踪
|
||||
|
||||
### 1. Home 页面(首页/落地页)
|
||||
|
||||
**已实施的追踪事件**:
|
||||
|
||||
#### 📄 页面浏览
|
||||
- **事件**: `LANDING_PAGE_VIEWED`
|
||||
- **触发时机**: 页面加载
|
||||
- **属性**:
|
||||
- `timestamp` - 访问时间
|
||||
- `is_authenticated` - 是否已登录
|
||||
- `user_id` - 用户ID(如果已登录)
|
||||
|
||||
#### 🎯 功能卡片点击
|
||||
- **事件**: `FEATURE_CARD_CLICKED`
|
||||
- **触发时机**: 用户点击任何功能卡片
|
||||
- **属性**:
|
||||
- `feature_id` - 功能ID(news-catalyst, concepts, stocks, etc.)
|
||||
- `feature_title` - 功能标题
|
||||
- `feature_url` - 目标URL
|
||||
- `is_featured` - 是否为推荐功能(新闻中心为 true)
|
||||
- `link_type` - 链接类型(internal/external)
|
||||
|
||||
**追踪的6个核心功能**:
|
||||
1. **新闻中心** (`news-catalyst`) - 推荐功能,黄色边框
|
||||
2. **概念中心** (`concepts`)
|
||||
3. **个股信息汇总** (`stocks`)
|
||||
4. **涨停板块分析** (`limit-analyse`)
|
||||
5. **个股罗盘** (`company`)
|
||||
6. **模拟盘交易** (`trading-simulation`)
|
||||
|
||||
---
|
||||
|
||||
### 2. StockOverview 页面(个股中心)✅ 已完成
|
||||
|
||||
**注意**:个股中心页面已完全实现 PostHog 追踪,通过 `src/views/StockOverview/hooks/useStockOverviewEvents.js` Hook。
|
||||
|
||||
**已实施的追踪事件**:
|
||||
|
||||
#### 📄 页面浏览
|
||||
- **事件**: `STOCK_OVERVIEW_VIEWED`
|
||||
- **触发时机**: 页面加载
|
||||
- **属性**:
|
||||
- `timestamp` - 访问时间
|
||||
|
||||
#### 📊 市场统计数据查看
|
||||
- **事件**: `STOCK_LIST_VIEWED`
|
||||
- **触发时机**: 加载市场统计数据
|
||||
- **属性**:
|
||||
- `total_market_cap` - 总市值
|
||||
- `total_volume` - 总成交量
|
||||
- `rising_stocks` - 上涨股票数
|
||||
- `falling_stocks` - 下跌股票数
|
||||
- `data_date` - 数据日期
|
||||
|
||||
#### 🔍 搜索追踪
|
||||
- **事件**: `SEARCH_INITIATED` / `STOCK_SEARCHED`
|
||||
- **触发时机**: 用户输入搜索、完成搜索
|
||||
- **属性**:
|
||||
- `query` - 搜索关键词
|
||||
- `result_count` - 搜索结果数量
|
||||
- `has_results` - 是否有结果
|
||||
- `context` - 固定为 'stock_overview'
|
||||
|
||||
#### 🎯 搜索结果点击
|
||||
- **事件**: `SEARCH_RESULT_CLICKED`
|
||||
- **触发时机**: 用户点击搜索结果
|
||||
- **属性**:
|
||||
- `stock_code` - 股票代码
|
||||
- `stock_name` - 股票名称
|
||||
- `exchange` - 交易所
|
||||
- `position` - 在搜索结果中的位置
|
||||
- `context` - 固定为 'stock_overview'
|
||||
|
||||
#### 🔥 概念卡片点击
|
||||
- **事件**: `CONCEPT_CLICKED`
|
||||
- **触发时机**: 用户点击热门概念卡片
|
||||
- **属性**:
|
||||
- `concept_name` - 概念名称
|
||||
- `concept_code` - 概念代码
|
||||
- `change_percent` - 涨跌幅
|
||||
- `stock_count` - 股票数量
|
||||
- `rank` - 排名
|
||||
- `source` - 固定为 'daily_hot_concepts'
|
||||
|
||||
#### 🏷️ 概念股票标签点击
|
||||
- **事件**: `CONCEPT_STOCK_CLICKED`
|
||||
- **触发时机**: 点击概念下的股票标签
|
||||
- **属性**:
|
||||
- `stock_code` - 股票代码
|
||||
- `stock_name` - 股票名称
|
||||
- `concept_name` - 所属概念
|
||||
- `source` - 固定为 'daily_hot_concepts_tag'
|
||||
|
||||
#### 📊 热力图股票点击
|
||||
- **事件**: `STOCK_CLICKED`
|
||||
- **触发时机**: 点击热力图中的股票
|
||||
- **属性**:
|
||||
- `stock_code` - 股票代码
|
||||
- `stock_name` - 股票名称
|
||||
- `change_percent` - 涨跌幅
|
||||
- `market_cap_range` - 市值区间
|
||||
- `source` - 固定为 'market_heatmap'
|
||||
|
||||
#### 📅 日期选择变化
|
||||
- **事件**: `SEARCH_FILTER_APPLIED`
|
||||
- **触发时机**: 用户选择不同的交易日期
|
||||
- **属性**:
|
||||
- `filter_type` - 固定为 'date'
|
||||
- `filter_value` - 新选择的日期
|
||||
- `previous_value` - 之前的日期
|
||||
- `context` - 固定为 'stock_overview'
|
||||
|
||||
**实施方式**: Custom Hook (`useStockOverviewEvents.js`) 已集成
|
||||
|
||||
---
|
||||
|
||||
### 3. Concept 页面(概念中心)
|
||||
|
||||
**已实施的追踪事件**:
|
||||
|
||||
#### 📄 页面浏览
|
||||
- **事件**: `CONCEPT_CENTER_VIEWED`
|
||||
- **触发时机**: 页面加载
|
||||
- **属性**:
|
||||
- `timestamp` - 访问时间
|
||||
|
||||
#### 🔍 搜索查询
|
||||
- **事件**: `SEARCH_QUERY_SUBMITTED`
|
||||
- **触发时机**: 用户搜索概念
|
||||
- **属性**:
|
||||
- `query` - 搜索关键词
|
||||
- `category` - 固定为 'concept'
|
||||
- `result_count` - 搜索结果数量
|
||||
- `has_results` - 是否有结果
|
||||
|
||||
#### 🎚️ 筛选追踪
|
||||
- **事件**: `SEARCH_FILTER_APPLIED`
|
||||
- **触发时机**: 用户更改筛选条件
|
||||
- **属性**:
|
||||
- `filter_type` - 筛选类型(sort/date)
|
||||
- `filter_value` - 筛选值
|
||||
- `previous_value` - 之前的值
|
||||
- `context` - 固定为 'concept_center'
|
||||
|
||||
**支持的筛选类型**:
|
||||
1. **排序** (`sort`): 涨跌幅/相关度/股票数量/概念名称
|
||||
2. **日期范围** (`date`): 选择交易日期
|
||||
|
||||
#### 🎯 概念卡片点击
|
||||
- **事件**: `CONCEPT_CLICKED`
|
||||
- **触发时机**: 用户点击概念卡片
|
||||
- **属性**:
|
||||
- `concept_id` - 概念ID
|
||||
- `concept_name` - 概念名称
|
||||
- `change_percent` - 涨跌幅
|
||||
- `stock_count` - 股票数量
|
||||
- `position` - 在列表中的位置
|
||||
- `source` - 固定为 'concept_center_list'
|
||||
|
||||
#### 👀 查看个股
|
||||
- **事件**: `CONCEPT_STOCKS_VIEWED`
|
||||
- **触发时机**: 用户点击"查看个股"按钮
|
||||
- **属性**:
|
||||
- `concept_name` - 概念名称
|
||||
- `stock_count` - 股票数量
|
||||
- `source` - 固定为 'concept_center'
|
||||
|
||||
#### 🏷️ 概念股票点击
|
||||
- **事件**: `CONCEPT_STOCK_CLICKED`
|
||||
- **触发时机**: 点击概念股票表格中的股票
|
||||
- **属性**:
|
||||
- `stock_code` - 股票代码
|
||||
- `stock_name` - 股票名称
|
||||
- `concept_name` - 所属概念
|
||||
- `source` - 固定为 'concept_center_stock_table'
|
||||
|
||||
#### 📊 历史时间轴查看
|
||||
- **事件**: `CONCEPT_TIMELINE_VIEWED`
|
||||
- **触发时机**: 用户点击"历史时间轴"按钮
|
||||
- **属性**:
|
||||
- `concept_id` - 概念ID
|
||||
- `concept_name` - 概念名称
|
||||
- `source` - 固定为 'concept_center'
|
||||
|
||||
#### 📄 翻页追踪
|
||||
- **事件**: `NEWS_LIST_VIEWED`
|
||||
- **触发时机**: 用户翻页
|
||||
- **属性**:
|
||||
- `page` - 页码
|
||||
- `filters` - 当前筛选条件
|
||||
- `sort` - 排序方式
|
||||
- `has_query` - 是否有搜索词
|
||||
- `date` - 日期
|
||||
- `context` - 固定为 'concept_center'
|
||||
|
||||
#### 🔄 视图模式切换
|
||||
- **事件**: `VIEW_MODE_CHANGED`
|
||||
- **触发时机**: 用户切换网格/列表视图
|
||||
- **属性**:
|
||||
- `view_mode` - 新视图模式(grid/list)
|
||||
- `previous_mode` - 之前的模式
|
||||
- `context` - 固定为 'concept_center'
|
||||
|
||||
---
|
||||
|
||||
### 4. Company 页面(公司详情/个股罗盘)
|
||||
|
||||
**已实施的追踪事件**:
|
||||
|
||||
#### 📄 页面浏览
|
||||
- **事件**: `COMPANY_PAGE_VIEWED`
|
||||
- **触发时机**: 页面加载
|
||||
- **属性**:
|
||||
- `timestamp` - 访问时间
|
||||
- `stock_code` - 当前查看的股票代码
|
||||
|
||||
#### 🔍 股票搜索
|
||||
- **事件**: `STOCK_SEARCHED`
|
||||
- **触发时机**: 用户输入股票代码并查询
|
||||
- **属性**:
|
||||
- `query` - 搜索的股票代码
|
||||
- `stock_code` - 股票代码
|
||||
- `previous_stock_code` - 之前查看的股票代码
|
||||
- `context` - 固定为 'company_page'
|
||||
|
||||
#### 🔄 Tab 切换
|
||||
- **事件**: `TAB_CHANGED`
|
||||
- **触发时机**: 用户切换不同的 Tab
|
||||
- **属性**:
|
||||
- `tab_index` - Tab 索引(0-3)
|
||||
- `tab_name` - Tab 名称(公司概览/股票行情/财务全景/盈利预测)
|
||||
- `previous_tab_index` - 之前的 Tab 索引
|
||||
- `stock_code` - 当前股票代码
|
||||
- `context` - 固定为 'company_page'
|
||||
|
||||
**支持的 Tab**:
|
||||
1. **公司概览** (index 0): 公司基本信息
|
||||
2. **股票行情** (index 1): 实时行情数据
|
||||
3. **财务全景** (index 2): 财务报表分析
|
||||
4. **盈利预测** (index 3): 盈利预测数据
|
||||
|
||||
#### ⭐ 自选股管理
|
||||
- **事件**: `WATCHLIST_ADDED` / `WATCHLIST_REMOVED`
|
||||
- **触发时机**: 用户添加/移除自选股
|
||||
- **属性**:
|
||||
- `stock_code` - 股票代码
|
||||
- `source` - 固定为 'company_page'
|
||||
|
||||
---
|
||||
|
||||
### 5. Community 页面(新闻催化分析)
|
||||
|
||||
**已实施的追踪事件**:
|
||||
|
||||
#### 📄 页面浏览
|
||||
- **事件**: `COMMUNITY_PAGE_VIEWED`
|
||||
- **触发时机**: 页面加载
|
||||
- **属性**:
|
||||
- `timestamp` - 访问时间
|
||||
- `has_hot_events` - 是否有热点事件
|
||||
- `has_keywords` - 是否有热门关键词
|
||||
|
||||
#### 🔍 搜索追踪
|
||||
- **事件**: `SEARCH_QUERY_SUBMITTED`
|
||||
- **触发时机**: 用户输入搜索关键词
|
||||
- **属性**:
|
||||
- `query` - 搜索关键词
|
||||
- `category` - 分类(固定为 'news')
|
||||
- `previous_query` - 上一次搜索词
|
||||
|
||||
#### 🎚️ 筛选追踪
|
||||
- **事件**: `SEARCH_FILTER_APPLIED`
|
||||
- **触发时机**: 用户更改筛选条件
|
||||
- **属性**:
|
||||
- `filter_type` - 筛选类型(sort/importance/date_range/industry)
|
||||
- `filter_value` - 筛选值
|
||||
- `previous_value` - 上一次的值
|
||||
|
||||
**支持的筛选类型**:
|
||||
1. **排序** (`sort`): 最新/最热/重要性
|
||||
2. **重要性** (`importance`): 全部/高/中/低
|
||||
3. **时间范围** (`date_range`): 今天/近7天/近30天
|
||||
4. **行业** (`industry`): 各行业代码
|
||||
|
||||
#### 🗞️ 新闻点击追踪
|
||||
- **事件**: `NEWS_ARTICLE_CLICKED`
|
||||
- **触发时机**: 用户点击新闻事件
|
||||
- **属性**:
|
||||
- `event_id` - 事件ID
|
||||
- `event_title` - 事件标题
|
||||
- `importance` - 重要性等级
|
||||
- `source` - 来源(固定为 'community_page')
|
||||
- `has_stocks` - 是否包含相关股票
|
||||
- `has_concepts` - 是否包含相关概念
|
||||
|
||||
#### 📖 详情查看追踪
|
||||
- **事件**: `NEWS_DETAIL_OPENED`
|
||||
- **触发时机**: 用户点击"查看详情"
|
||||
- **属性**:
|
||||
- `event_id` - 事件ID
|
||||
- `source` - 来源(固定为 'community_page')
|
||||
|
||||
#### 📄 翻页追踪
|
||||
- **事件**: `NEWS_LIST_VIEWED`
|
||||
- **触发时机**: 用户翻页
|
||||
- **属性**:
|
||||
- `page` - 页码
|
||||
- `filters` - 当前筛选条件
|
||||
- `sort` - 排序方式
|
||||
- `importance` - 重要性
|
||||
- `has_query` - 是否有搜索词
|
||||
|
||||
---
|
||||
|
||||
## 🛠️ 实施方式
|
||||
|
||||
### 方案:Custom Hook 集成(推荐)
|
||||
|
||||
**优势**:
|
||||
- ✅ 集中管理,易于维护
|
||||
- ✅ 自动追踪,无需修改组件
|
||||
- ✅ 符合关注点分离原则
|
||||
- ✅ 便于测试和调试
|
||||
|
||||
### 修改的文件
|
||||
|
||||
#### 0. `src/views/StockOverview/hooks/useStockOverviewEvents.js` ✅
|
||||
|
||||
**文件已存在**,无需修改。已完整实现个股中心的所有追踪事件。
|
||||
|
||||
#### 1. `src/views/Concept/hooks/useConceptEvents.js`
|
||||
|
||||
**新建 Hook 文件**:
|
||||
```javascript
|
||||
import { usePostHogTrack } from '../../../hooks/usePostHogRedux';
|
||||
import { RETENTION_EVENTS } from '../../../lib/constants';
|
||||
```
|
||||
|
||||
**提供的追踪函数**:
|
||||
- `trackConceptSearched()` - 搜索概念
|
||||
- `trackFilterApplied()` - 筛选变化
|
||||
- `trackConceptClicked()` - 概念点击
|
||||
- `trackConceptStocksViewed()` - 查看个股
|
||||
- `trackConceptStockClicked()` - 点击概念股票
|
||||
- `trackConceptTimelineViewed()` - 历史时间轴
|
||||
- `trackPageChange()` - 翻页
|
||||
- `trackViewModeChanged()` - 视图切换
|
||||
|
||||
#### 2. `src/views/Company/hooks/useCompanyEvents.js`
|
||||
|
||||
**新建 Hook 文件**:
|
||||
```javascript
|
||||
import { usePostHogTrack } from '../../../hooks/usePostHogRedux';
|
||||
import { RETENTION_EVENTS } from '../../../lib/constants';
|
||||
```
|
||||
|
||||
**提供的追踪函数**:
|
||||
- `trackStockSearched()` - 股票搜索
|
||||
- `trackTabChanged()` - Tab 切换
|
||||
- `trackWatchlistAdded()` - 加入自选
|
||||
- `trackWatchlistRemoved()` - 移除自选
|
||||
|
||||
#### 3. `src/views/Company/index.js`
|
||||
|
||||
**添加的导入**:
|
||||
```javascript
|
||||
import { useCompanyEvents } from './hooks/useCompanyEvents';
|
||||
```
|
||||
|
||||
**添加的 Hook**:
|
||||
```javascript
|
||||
const {
|
||||
trackStockSearched,
|
||||
trackTabChanged,
|
||||
trackWatchlistAdded,
|
||||
trackWatchlistRemoved,
|
||||
} = useCompanyEvents({ stockCode });
|
||||
```
|
||||
|
||||
**添加的 State**:
|
||||
```javascript
|
||||
const [currentTabIndex, setCurrentTabIndex] = useState(0);
|
||||
```
|
||||
|
||||
**修改的函数**:
|
||||
1. **`handleSearch`**: 追踪股票搜索
|
||||
2. **`handleWatchlistToggle`**: 追踪自选股添加/移除
|
||||
3. **Tabs `onChange`**: 追踪 Tab 切换
|
||||
|
||||
#### 4. `src/views/Concept/index.js`
|
||||
|
||||
**添加的导入**:
|
||||
```javascript
|
||||
import { useConceptEvents } from './hooks/useConceptEvents';
|
||||
```
|
||||
|
||||
**添加的 Hook**:
|
||||
```javascript
|
||||
const {
|
||||
trackConceptSearched,
|
||||
trackFilterApplied,
|
||||
trackConceptClicked,
|
||||
trackConceptStocksViewed,
|
||||
trackConceptStockClicked,
|
||||
trackConceptTimelineViewed,
|
||||
trackPageChange,
|
||||
trackViewModeChanged,
|
||||
} = useConceptEvents({ navigate });
|
||||
```
|
||||
|
||||
**修改的函数**:
|
||||
1. **`handleSearch`**: 追踪搜索查询
|
||||
2. **`handleSortChange`**: 追踪排序变化
|
||||
3. **`handleDateChange`**: 追踪日期变化
|
||||
4. **`handlePageChange`**: 追踪翻页
|
||||
5. **`handleConceptClick`**: 追踪概念点击
|
||||
6. **`handleViewStocks`**: 追踪查看个股
|
||||
7. **`handleViewContent`**: 追踪历史时间轴
|
||||
8. **视图切换按钮**: 追踪网格/列表切换
|
||||
|
||||
#### 3. `src/views/Home/HomePage.js`
|
||||
|
||||
**添加的导入**:
|
||||
```javascript
|
||||
import { usePostHogTrack } from '../../hooks/usePostHogRedux';
|
||||
import { ACQUISITION_EVENTS } from '../../lib/constants';
|
||||
```
|
||||
|
||||
**添加的 Hook**:
|
||||
```javascript
|
||||
const { track } = usePostHogTrack();
|
||||
```
|
||||
|
||||
**添加的 useEffect**(页面浏览追踪):
|
||||
```javascript
|
||||
useEffect(() => {
|
||||
track(ACQUISITION_EVENTS.LANDING_PAGE_VIEWED, {
|
||||
timestamp: new Date().toISOString(),
|
||||
is_authenticated: isAuthenticated,
|
||||
user_id: user?.id || null,
|
||||
});
|
||||
}, [track, isAuthenticated, user?.id]);
|
||||
```
|
||||
|
||||
**修改的函数**:
|
||||
- **`handleProductClick`**: 从接收 URL 改为接收完整 feature 对象,添加追踪逻辑
|
||||
|
||||
**修改后的代码**:
|
||||
```javascript
|
||||
const handleProductClick = useCallback((feature) => {
|
||||
// 🎯 PostHog 追踪:功能卡片点击
|
||||
track(ACQUISITION_EVENTS.FEATURE_CARD_CLICKED, {
|
||||
feature_id: feature.id,
|
||||
feature_title: feature.title,
|
||||
feature_url: feature.url,
|
||||
is_featured: feature.featured || false,
|
||||
link_type: feature.url.startsWith('http') ? 'external' : 'internal',
|
||||
});
|
||||
|
||||
// 原有导航逻辑
|
||||
if (feature.url.startsWith('http')) {
|
||||
window.open(feature.url, '_blank');
|
||||
} else {
|
||||
navigate(feature.url);
|
||||
}
|
||||
}, [track, navigate]);
|
||||
```
|
||||
|
||||
**更新的 onClick 事件**:
|
||||
```javascript
|
||||
// 从
|
||||
onClick={() => handleProductClick(coreFeatures[0].url)}
|
||||
|
||||
// 改为
|
||||
onClick={() => handleProductClick(coreFeatures[0])}
|
||||
```
|
||||
|
||||
#### 1. `src/views/Community/hooks/useEventFilters.js`
|
||||
|
||||
**添加的导入**:
|
||||
```javascript
|
||||
import { usePostHogTrack } from '../../../hooks/usePostHogRedux';
|
||||
import { RETENTION_EVENTS } from '../../../lib/constants';
|
||||
```
|
||||
|
||||
**添加的Hook**:
|
||||
```javascript
|
||||
const { track } = usePostHogTrack();
|
||||
```
|
||||
|
||||
**修改的函数**:
|
||||
1. **`updateFilters`**: 追踪搜索和筛选
|
||||
2. **`handlePageChange`**: 追踪翻页
|
||||
3. **`handleEventClick`**: 追踪新闻点击
|
||||
4. **`handleViewDetail`**: 追踪详情查看
|
||||
|
||||
#### 2. `src/views/Community/index.js`
|
||||
|
||||
**添加的导入**:
|
||||
```javascript
|
||||
import { usePostHogTrack } from '../../hooks/usePostHogRedux';
|
||||
import { RETENTION_EVENTS } from '../../lib/constants';
|
||||
```
|
||||
|
||||
**添加的Hook**:
|
||||
```javascript
|
||||
const { track } = usePostHogTrack();
|
||||
```
|
||||
|
||||
**添加的useEffect**:
|
||||
```javascript
|
||||
useEffect(() => {
|
||||
track(RETENTION_EVENTS.COMMUNITY_PAGE_VIEWED, {
|
||||
timestamp: new Date().toISOString(),
|
||||
has_hot_events: hotEvents && hotEvents.length > 0,
|
||||
has_keywords: popularKeywords && popularKeywords.length > 0,
|
||||
});
|
||||
}, [track]);
|
||||
```
|
||||
|
||||
---
|
||||
|
||||
## 📊 追踪效果示例
|
||||
|
||||
### 用户行为路径示例
|
||||
|
||||
**首页转化路径**:
|
||||
```
|
||||
1. 游客访问首页
|
||||
→ 触发: LANDING_PAGE_VIEWED
|
||||
→ 属性: { is_authenticated: false, user_id: null }
|
||||
|
||||
2. 点击"新闻中心"功能卡片
|
||||
→ 触发: FEATURE_CARD_CLICKED
|
||||
→ 属性: { feature_id: "news-catalyst", feature_title: "新闻中心", is_featured: true, link_type: "internal" }
|
||||
|
||||
3. 进入 Community 页面
|
||||
→ 触发: COMMUNITY_PAGE_VIEWED
|
||||
```
|
||||
|
||||
**Community 页面行为路径**:
|
||||
```
|
||||
1. 用户进入 Community 页面
|
||||
→ 触发: COMMUNITY_PAGE_VIEWED
|
||||
|
||||
2. 用户搜索 "人工智能"
|
||||
→ 触发: SEARCH_QUERY_SUBMITTED
|
||||
→ 属性: { query: "人工智能", category: "news" }
|
||||
|
||||
3. 用户筛选 "重要性:高"
|
||||
→ 触发: SEARCH_FILTER_APPLIED
|
||||
→ 属性: { filter_type: "importance", filter_value: "high" }
|
||||
|
||||
4. 用户点击第一条新闻
|
||||
→ 触发: NEWS_ARTICLE_CLICKED
|
||||
→ 属性: { event_id: "123", event_title: "...", importance: "high", source: "community_page" }
|
||||
|
||||
5. 用户翻到第2页
|
||||
→ 触发: NEWS_LIST_VIEWED
|
||||
→ 属性: { page: 2, filters: { sort: "new", importance: "high", has_query: true } }
|
||||
|
||||
6. 用户点击"查看详情"
|
||||
→ 触发: NEWS_DETAIL_OPENED
|
||||
→ 属性: { event_id: "456", source: "community_page" }
|
||||
```
|
||||
|
||||
---
|
||||
|
||||
## 🧪 测试方法
|
||||
|
||||
### 1. 使用 Redux DevTools
|
||||
|
||||
1. 打开应用:`npm start`
|
||||
2. 打开浏览器 Redux DevTools
|
||||
3. 筛选 `posthog/trackEvent` actions
|
||||
4. 执行各种操作
|
||||
5. 查看追踪的事件和属性
|
||||
|
||||
### 2. 控制台日志
|
||||
|
||||
开发环境下,PostHog 会自动输出日志:
|
||||
|
||||
```
|
||||
📍 Event tracked: Community Page Viewed { timestamp: "...", has_hot_events: true }
|
||||
📍 Event tracked: Search Query Submitted { query: "人工智能", category: "news" }
|
||||
📍 Event tracked: Search Filter Applied { filter_type: "importance", filter_value: "high" }
|
||||
```
|
||||
|
||||
### 3. PostHog Dashboard
|
||||
|
||||
1. 登录 PostHog 后台
|
||||
2. 查看 "Events" 页面
|
||||
3. 筛选 Community 相关事件:
|
||||
- `Community Page Viewed`
|
||||
- `Search Query Submitted`
|
||||
- `Search Filter Applied`
|
||||
- `News Article Clicked`
|
||||
- `News List Viewed`
|
||||
|
||||
---
|
||||
|
||||
## 📈 数据分析建议
|
||||
|
||||
### 1. 搜索行为分析
|
||||
|
||||
**问题**: 用户最常搜索什么?
|
||||
|
||||
**方法**:
|
||||
- 筛选 `SEARCH_QUERY_SUBMITTED` 事件
|
||||
- 按 `query` 属性分组
|
||||
- 查看 Top 关键词
|
||||
|
||||
### 2. 筛选偏好分析
|
||||
|
||||
**问题**: 用户更喜欢什么排序方式?
|
||||
|
||||
**方法**:
|
||||
- 筛选 `SEARCH_FILTER_APPLIED` 事件
|
||||
- 按 `filter_type: "sort"` 筛选
|
||||
- 按 `filter_value` 分组统计
|
||||
|
||||
### 3. 新闻热度分析
|
||||
|
||||
**问题**: 哪些新闻最受欢迎?
|
||||
|
||||
**方法**:
|
||||
- 筛选 `NEWS_ARTICLE_CLICKED` 事件
|
||||
- 按 `event_id` 分组
|
||||
- 统计点击次数
|
||||
|
||||
### 4. 用户旅程分析
|
||||
|
||||
**问题**: 用户从搜索到点击的转化率?
|
||||
|
||||
**方法**:
|
||||
- 创建漏斗:
|
||||
1. `COMMUNITY_PAGE_VIEWED`
|
||||
2. `SEARCH_QUERY_SUBMITTED`
|
||||
3. `NEWS_ARTICLE_CLICKED`
|
||||
- 分析每一步的流失率
|
||||
|
||||
---
|
||||
|
||||
## 🔧 扩展计划
|
||||
|
||||
### 下一步:其他页面追踪
|
||||
|
||||
按优先级排序:
|
||||
|
||||
1. **Concept(概念中心)** ⭐⭐⭐
|
||||
- 搜索概念
|
||||
- 点击概念卡片
|
||||
- 查看概念详情
|
||||
- 点击概念内股票
|
||||
|
||||
2. **StockOverview(个股中心)** ⭐⭐⭐
|
||||
- 搜索股票
|
||||
- 点击股票卡片
|
||||
- 查看股票详情
|
||||
- 切换 Tab
|
||||
|
||||
3. **LimitAnalyse(涨停分析)** ⭐⭐
|
||||
- 进入页面
|
||||
- 点击涨停板块
|
||||
- 展开板块详情
|
||||
- 点击涨停个股
|
||||
|
||||
4. **TradingSimulation(模拟盘)** ⭐⭐
|
||||
- 进入模拟盘
|
||||
- 下单操作
|
||||
- 查看持仓
|
||||
- 查看历史
|
||||
|
||||
5. **Company(公司详情)** ⭐
|
||||
- 查看公司概览
|
||||
- 查看财务全景
|
||||
- 查看盈利预测
|
||||
- Tab 切换
|
||||
|
||||
---
|
||||
|
||||
## 💡 最佳实践
|
||||
|
||||
### 1. 属性命名规范
|
||||
|
||||
- 使用 **snake_case** 命名(与 PostHog 推荐一致)
|
||||
- 属性名要 **描述性强**,易于理解
|
||||
- 使用 **布尔值** 表示是/否(has_xxx, is_xxx)
|
||||
- 使用 **枚举值** 表示类别(filter_type: "sort")
|
||||
|
||||
### 2. 事件追踪原则
|
||||
|
||||
- **追踪用户意图**,而不仅仅是点击
|
||||
- **添加上下文**,帮助分析(previous_value, source)
|
||||
- **保持一致性**,相似事件使用相似属性
|
||||
- **避免敏感信息**,不追踪用户隐私数据
|
||||
|
||||
### 3. 性能优化
|
||||
|
||||
- 使用 **`usePostHogTrack`** 而不是 `usePostHogRedux`
|
||||
- 更轻量,只订阅追踪功能
|
||||
- 避免不必要的重渲染
|
||||
- 在 **Custom Hooks** 中集成,而不是每个组件
|
||||
- 集中管理,易于维护
|
||||
- 减少重复代码
|
||||
|
||||
---
|
||||
|
||||
## ⚠️ 注意事项
|
||||
|
||||
### 1. 依赖管理
|
||||
|
||||
确保 `useCallback` 的依赖数组包含 `track`:
|
||||
|
||||
```javascript
|
||||
// ✅ 正确
|
||||
const handleClick = useCallback(() => {
|
||||
track(EVENT_NAME, { ... });
|
||||
}, [track]);
|
||||
|
||||
// ❌ 错误(缺少 track)
|
||||
const handleClick = useCallback(() => {
|
||||
track(EVENT_NAME, { ... });
|
||||
}, []);
|
||||
```
|
||||
|
||||
### 2. 事件去重
|
||||
|
||||
避免重复追踪相同事件:
|
||||
|
||||
```javascript
|
||||
// ✅ 正确(只在值变化时追踪)
|
||||
if (newFilters.sort !== filters.sort) {
|
||||
track(SEARCH_FILTER_APPLIED, { ... });
|
||||
}
|
||||
|
||||
// ❌ 错误(每次都追踪)
|
||||
track(SEARCH_FILTER_APPLIED, { ... });
|
||||
```
|
||||
|
||||
### 3. 空值处理
|
||||
|
||||
使用安全的属性访问:
|
||||
|
||||
```javascript
|
||||
// ✅ 正确
|
||||
has_stocks: !!(event.related_stocks && event.related_stocks.length > 0)
|
||||
|
||||
// ❌ 错误(可能报错)
|
||||
has_stocks: event.related_stocks.length > 0
|
||||
```
|
||||
|
||||
---
|
||||
|
||||
## 📚 参考资料
|
||||
|
||||
- **PostHog Events 文档**: https://posthog.com/docs/data/events
|
||||
- **PostHog Properties 文档**: https://posthog.com/docs/data/properties
|
||||
- **Redux PostHog 集成**: `POSTHOG_REDUX_INTEGRATION.md`
|
||||
- **事件常量定义**: `src/lib/constants.js`
|
||||
|
||||
---
|
||||
|
||||
## 🎉 总结
|
||||
|
||||
### 已实现的功能
|
||||
|
||||
- ✅ Home 页面追踪(2个事件)
|
||||
- ✅ StockOverview 页面完整追踪(10个事件)✨ 已完成
|
||||
- ✅ Concept 页面完整追踪(9个事件)
|
||||
- ✅ Company 页面完整追踪(5个事件)
|
||||
- ✅ Community 页面完整追踪(7个事件)
|
||||
- ✅ Custom Hook 集成方案
|
||||
- ✅ Redux DevTools 调试支持
|
||||
- ✅ 详细的事件属性
|
||||
|
||||
### 追踪的用户行为
|
||||
|
||||
**Home 页面**:
|
||||
1. **页面访问** - 了解流量来源、登录转化率
|
||||
2. **功能卡片点击** - 识别最受欢迎的功能
|
||||
3. **推荐功能效果** - 分析特色功能(新闻中心)的点击率
|
||||
|
||||
**StockOverview 页面** ✨:
|
||||
1. **页面访问** - 了解个股中心流量
|
||||
2. **搜索行为** - 股票搜索、搜索结果点击
|
||||
3. **概念交互** - 热门概念点击、概念股票标签点击
|
||||
4. **热力图交互** - 热力图中股票点击
|
||||
5. **数据筛选** - 日期选择变化
|
||||
6. **市场统计** - 市场数据查看
|
||||
|
||||
**Concept 页面**:
|
||||
1. **页面访问** - 了解概念中心流量
|
||||
2. **搜索行为** - 概念搜索、搜索结果数量
|
||||
3. **筛选偏好** - 排序方式、日期选择
|
||||
4. **概念交互** - 概念点击、位置追踪
|
||||
5. **个股查看** - 查看个股、股票点击
|
||||
6. **时间轴查看** - 历史时间轴
|
||||
7. **翻页行为** - 优化分页逻辑
|
||||
8. **视图切换** - 网格/列表偏好
|
||||
|
||||
**Company 页面**:
|
||||
1. **页面访问** - 了解公司详情页流量
|
||||
2. **股票搜索** - 用户查询哪些股票
|
||||
3. **Tab 切换** - 用户最关注哪个 Tab(概览/行情/财务/预测)
|
||||
4. **自选股管理** - 自选股添加/移除行为
|
||||
5. **股票切换** - 分析用户查看股票的路径
|
||||
|
||||
**Community 页面**:
|
||||
1. **页面访问** - 了解流量来源
|
||||
2. **搜索行为** - 了解用户需求
|
||||
3. **筛选偏好** - 优化默认设置
|
||||
4. **内容点击** - 识别热门内容
|
||||
5. **详情查看** - 分析用户兴趣
|
||||
6. **翻页行为** - 优化分页逻辑
|
||||
|
||||
### 下一步计划
|
||||
|
||||
1. ~~在关键页面实施追踪(Home, StockOverview, Concept, Company, Community)~~ ✅ 已完成
|
||||
2. **下一步**:其他页面追踪
|
||||
- LimitAnalyse(涨停分析)⭐⭐
|
||||
- TradingSimulation(模拟盘)⭐⭐
|
||||
3. 创建 PostHog Dashboard 和 Insights
|
||||
4. 设置用户行为漏斗分析
|
||||
5. 配置 Feature Flags 进行 A/B 测试
|
||||
|
||||
---
|
||||
|
||||
**Home, StockOverview, Concept, Company, Community 页面追踪全部完成!** 🚀
|
||||
|
||||
现在你可以在 PostHog 后台看到完整的用户行为数据:
|
||||
- **首页** → **个股中心/概念中心/公司详情/新闻中心** 的完整转化路径
|
||||
- **搜索行为**、**筛选偏好**、**内容点击** 的详细数据
|
||||
- **Tab 切换**、**视图切换**、**翻页行为** 的用户习惯分析
|
||||
- **自选股管理** 的用户行为追踪
|
||||
|
||||
共追踪 **33个事件**,覆盖 **5个核心页面**。
|
||||
Reference in New Issue
Block a user