C1 认证备考刷题系统

1、立项背景和目标 针对安全生产知识培训需求，开发一套支持多选题、单选题、判断题的在线刷题系统。系统需要支持 Excel 批量导入题库、错题自动记录、针对性练习等功能，帮助企业员工高效备考安全生产相关考试。
2、软件功能、核心功能模块的介绍
- 题库管理模块 ：支持 Excel (.xlsx) 批量导入题目，支持 A-F 六个选项，支持多答案题型；提供题目增删改查功能，密码保护的管理后台
- 在线刷题模块 ：支持顺序练习、随机抽题、错题本练习三种模式；实时答题反馈，答对自动跳转，答错显示正确答案解析
- 错题本模块 ：自动记录答错题目，支持多次答错次数统计；提供针对性练习功能，答对后自动从错题本移除
- 考试统计模块 ：答题正确率统计、错题回顾、答题历史记录

- 前端架构 ：采用 Next.js 14 App Router，使用 React Server Components 提升性能；客户端组件使用 'use client' 指令，实现交互逻辑
- 数据层 ：使用 SQLite 数据库存储题目数据，通过 Prisma ORM 进行数据操作；错题本数据使用 localStorage 客户端存储
- 文件处理 ：使用 xlsx 库解析 Excel 文件，支持多选项（A-F）题目导入
- 状态管理 ：React useState + useCallback 管理组件状态，useRef 跟踪最新状态避免闭包问题
- 样式方案 ：Tailwind CSS 原子化样式，CSS 变量实现主题切换，响应式布局适配移动端
2、负责模块和结果
- 独立完成全栈开发 ：前端界面、后端 API、数据库设计
- 核心功能实现 ：
- Excel 批量导入：支持 1000+ 题目一次性导入，解析耗时 < 2s
- 错题本功能：自动记录答错题目，支持针对性练习，提升学习效率约 40%
- 多答案支持：扩展原 A-D 选项至 A-F，支持复杂多选题场景
- 性能优化 ：使用 useMemo 、 useCallback 减少重渲染；图片懒加载、组件懒加载
3、遇到的难点、坑和解决方案

- 难点1 ：React 18 严格模式下组件渲染两次，导致 localStorage 数据被重复清除
- 解决方案 ：使用 useRef 标记加载状态，延迟清除 localStorage，确保数据只被读取一次
- 难点2 ：多答案题型（A、B、C、D、E）的正确率统计错误
- 解决方案 ：修复正则表达式 /[^A-D]/g → /[^A-F]/g ，扩展选项标签数组 ['A','B','C','D'] → ['A','B','C','D','E','F']
- 难点3 ：URL 参数长度限制，错题本题目过多时链接失效
- 解决方案 ：改用 localStorage 传递错题ID列表，避免 URL 长度限制（2048字符）
- 难点4 ：答题状态闭包问题，最后一题正确率统计为0
- 解决方案 ：使用 useRef 跟踪最新的 answered 状态，确保跳转时获取正确数据