zdl
|
0da18e868a
|
refactor: 提取 ModeToggleButtons 为独立子组件
问题：
- EventScrollList 组件中模式切换按钮代码内联（17行）
- 降低代码可读性和可维护性
- 按钮组无法在其他地方复用
修改：
1. 新建 ModeToggleButtons.js 独立组件
- 接收 mode 和 onModeChange 两个 props
- 包含完整的 JSDoc 注释
- 支持 vertical（纵向）和 four-row（平铺）两种模式
2. 重构 EventScrollList.js
- 删除未使用的 import（Button, ButtonGroup）
- 导入 ModeToggleButtons 组件
- 替换 17 行内联代码为 1 行组件调用
- 代码净减少 14 行
效果：
- ✅ 职责分离：模式切换逻辑独立封装
- ✅ 可复用性：其他页面可直接导入使用
- ✅ 易维护性：修改按钮样式只需改一个文件
- ✅ 易测试性：可单独编写单元测试
- ✅ 代码简洁：EventScrollList 更简洁易读
🤖 Generated with [Claude Code](https://claude.com/claude-code)
Co-Authored-By: Claude <noreply@anthropic.com>
|
2025-11-05 13:44:34 +08:00 |
|