第18篇：错题本与收藏功能——WRONG_COLLECT 机制

一、引言

错题本和收藏功能是驾考应用的重要辅助工具，帮助用户复习薄弱环节和重点题目。DriverLicenseExam 项目通过 WRONG_COLLECT 枚举实现了统一的错题/收藏管理机制。本文将深入解析其实现。

二、错题与收藏的数据模型

2.1 数据标记字段

在 ExamDetail 中，通过两个字段标记错题和收藏状态：

export class ExamDetail {
  // ... 其他字段
  isCorrect?: boolean;  // 答题状态：true 正确，false 错误，undefined 未答
  isCollect: boolean;   // 收藏状态：true 已收藏，false 未收藏
  selected: string[];   // 已选答案（用于回显）
}

2.2 WRONG_COLLECT 枚举

export enum WRONG_COLLECT {
  WRONG = 0,    // 错题模式
  COLLECT = 1,  // 收藏模式
}

三、错题本功能

3.1 错题数据获取

// 获取全部错题数量
public getErrorCount(): number {
  return this.examDetails.filter(item => item.isCorrect === false).length;
}

// 获取错题试卷
case EXAM_MANAGER_TYPE.error:
  examData = originData.filter(item => item.isCorrect === false);
  break;

3.2 按章节查看错题

// 获取带章节分类的错题列表
public getChapterListByType(type: WRONG_COLLECT): Chapter[] {
  const chapterTitleList: string[] = [];
  const chapterList: Chapter[] = [];

  if (type === WRONG_COLLECT.WRONG) {
    this.examDetails.forEach((item: ExamDetail) => {
      if (chapterTitleList.indexOf(item.chapterName) === -1 && item.isCorrect === false) {
        chapterTitleList.push(item.chapterName);
      }
    });

    chapterTitleList.forEach((item: string, index: number) => {
      const examManger = this.getManagerByName(item, EXAM_MANAGER_TYPE.chapter_name, 
        0, item, WRONG_COLLECT.WRONG);
      const color = COLOR_GARDEN[index % 6];
      chapterList.push(new Chapter(item, color, examManger));
    });
  }
  return chapterList;
}

四、收藏功能

4.1 收藏操作

// 在 SelectComponent 中切换收藏状态
@Builder
collectButton() {
  Image(this.item.isCollect ? $r('app.media.ic_collected') : $r('app.media.ic_collect'))
    .width(24).height(24)
    .onClick(() => {
      this.item.isCollect = !this.item.isCollect;
    });
}

4.2 收藏数据获取

// 获取全部收藏数量
public getCollectCount(): number {
  return this.examDetails.filter(item => item.isCollect === true).length;
}

// 获取收藏试卷
case EXAM_MANAGER_TYPE.collect:
  examData = originData.filter(item => item.isCollect === true);
  break;

五、批量操作

// 清空所有错题
public clearWrongQuestion(): void {
  this.examDetails.forEach((item: ExamDetail) => item.isCorrect = undefined);
}

// 清空所有收藏
public clearCollectQuestion(): void {
  this.examDetails.forEach((item: ExamDetail) => item.isCollect = false);
}

六、错题收藏页面

// CollectionView.ets
@ComponentV2
export struct CollectionView {
  examService: ExamService = ExamService.instance(this.getUIContext().getHostContext() as Context);
  @Local currentTab: number = 0;  // 0: 错题本, 1: 收藏

  build() {
    Column() {
      // Tab 切换
      Row() {
        Text('错题本').onClick(() => this.currentTab = 0);
        Text('收藏').onClick(() => this.currentTab = 1);
      }

      // 内容
      if (this.currentTab === 0) {
        // 错题列表
        ChapterListView({ type: WRONG_COLLECT.WRONG });
      } else {
        // 收藏列表
        ChapterListView({ type: WRONG_COLLECT.COLLECT });
      }
    }
  }
}

七、总结

错题本和收藏功能通过简单的数据标记字段和统一的 WRONG_COLLECT 枚举实现了完整的错题/收藏管理机制。这种设计简洁高效，易于扩展。

关键源码文件：

• commons/datasource/src/main/ets/ExamService.ets — 错题/收藏服务
• commons/datasource/src/main/ets/Model.ets — 数据模型
• products/entry/src/main/ets/pages/collection/CollectionView.ets — 错题收藏页面
• components/exam/src/main/ets/components/SelectComponent.ets — 收藏按钮