连接状态: {isConnected ? '已连接' : '未连接'}
);
}
```
### 消息格式
```javascript
{
type: 'trade_alert', // 消息类型
severity: 'info', // 'success' | 'error' | 'warning' | 'info'
title: '通知标题', // 主标题
message: '详细消息内容', // 详细内容
timestamp: Date.now(), // 时间戳（自动生成）
autoClose: 8000, // 自动关闭时长（毫秒），0 或 false 表示不自动关闭
id: 'unique_id' // 唯一ID（自动生成）
}
```
---
## 🔧 配置说明
### Mock 服务配置
在 `src/services/mockSocketService.js` 中可以配置：
```javascript
// 修改模拟数据
const mockTradeAlerts = [
{
severity: 'success',
title: '自定义标题',
message: '自定义消息',
autoClose: 8000,
},
// 添加更多...
];
// 调整推送频率
socket.startMockPush(20000, 2); // 每20秒推送1-2条
```
### NotificationContext 配置
在 `src/contexts/NotificationContext.js` 中：
```javascript
// 修改最大消息数量（默认 5 条）
const maxNotifications = 5; // 修改为其他数值
// 修改默认音效状态
const [soundEnabled, setSoundEnabled] = useState(true); // false 关闭音效
// 修改音效音量
audioRef.current.volume = 0.5; // 0.0 - 1.0
```
### NotificationContainer 配置
在 `src/components/NotificationContainer/index.js` 中：
```javascript
// 调整消息间距