当前位置：首页 > news >正文

HarmonyOS 本地知识库应用实践：如何在《五千年史卷》中组织人物、事件和朝代数据

news 2026/6/13 16:33:16

摘要

内容型应用的难点不只是“把资料放进去”，而是如何让资料可检索、可分类、可关联、可扩展。本文以鸿蒙应用《五千年史卷》为例，介绍如何使用 ArkTS 构建一个离线历史知识库，重点讲解人物与事件分离建模、本地搜索、朝代聚合和学习行为记录。

一、问题背景：历史内容不能只做成文章列表

《五千年史卷》内置了 283 篇历史内容，覆盖人物、事件、朝代和文化资料。

一开始最容易想到的做法，是把所有内容都做成文章卡片：

title summary dynasty image

但实际整理历史内容时会遇到一个问题：历史人物和历史事件不能混在一起。

例如：

“周公”是人物；
“周公制礼作乐”是事件；
“甲骨文发现”是事件；
“秦始皇”是人物；
“秦统一六国”是事件。

如果把它们全部塞进同一个列表，搜索、详情页、朝代统计都会变得混乱。

所以本项目采用了“人物、事件、朝代、资料”分层建模。

二、人物模型：强调身份、生平和关联事件

人物数据结构如下：

export interface HistoricalPerson { name: string; dynasty: string; years: string; identity: string; summary: string; deeds: string[]; relatedEvents: string[]; image: string; imagePrompt: string; keyword: string; }

这个结构关注的是“这个人是谁”。

其中：

name 表示人物名称；
dynasty 表示所属朝代；
years 表示生卒或活动时期；
identity 表示身份；
deeds 存储主要事迹；
relatedEvents 关联历史事件；
image 对应本地人物图片。

这样可以支撑人物详情页、人物卡片、人物搜索、收藏和学习记录。

三、事件模型：强调时间、过程、人物和影响

事件结构单独设计：

export interface HistoricalEvent { title: string; dynasty: string; time: string; summary: string; process?: string; people: string[]; impact: string; keyword: string; sourceUrl?: string; }

事件关注的是“发生了什么”。

其中：

title 是事件标题；
time 是发生时间；
summary 是简要说明；
process 是事件经过；
people 是相关人物；
impact 是历史影响；
sourceUrl 可关联资料来源。

这个模型解决了一个关键问题：事件详情页可以完整展示背景、经过、结果和影响，而不是只显示一句简介。

四、内容资料模型：承载历史故事与扩展内容

除了人物和事件，项目还有普通历史资料：

export interface HistoryContent { title: string; sub: string; image: string; views: string; category: string; dynasty: string; keyword: string; sourceUrl?: string; }

这类内容更像文章入口，可以覆盖文化、制度、故事和历史总览。

人物、事件和资料三者分开后，应用就能做到：

人物页看人；
事件页看事；
朝代页看时代；
资料页看扩展阅读。

这比单纯文章列表更适合历史学习应用。

五、数据合并与去重

项目不是只维护一个小数组，而是将基础数据、补充数据、扩展数据和目录事件合并：

export const FULL_HISTORICAL_PEOPLE = uniqueHistoricalPeople( HISTORICAL_PEOPLE .concat(SUPPLEMENTAL_HISTORICAL_PEOPLE) .concat(EXPANDED_HISTORICAL_PEOPLE) ); export const FULL_HISTORICAL_EVENTS = uniqueHistoricalEvents( ALL_HISTORICAL_EVENTS .concat(SUPPLEMENTAL_HISTORICAL_EVENTS) .concat(EXPANDED_HISTORICAL_EVENTS) .concat(CATALOG_HISTORICAL_EVENTS) );

为什么要这样设计？

因为历史内容会不断扩充。如果所有内容都写在一个巨大数组里，后期维护非常痛苦。

拆分后可以按来源、阶段或用途维护数据，最后统一合并成完整人物库和事件库。

六、本地搜索：不依赖服务器的分类检索

项目实现了完全本地搜索。

人物搜索逻辑：

private localSearchPeople(): HistoricalPerson[] { let keyword: string = this.normalizedSearchKeyword(); if (keyword === '') { return FULL_HISTORICAL_PEOPLE.slice(0, 8); } return FULL_HISTORICAL_PEOPLE.filter((person: HistoricalPerson) => { return this.matchesKeyword(person.name, keyword) || this.matchesKeyword(person.dynasty, keyword) || this.matchesKeyword(person.identity, keyword) || this.matchesKeyword(person.summary, keyword) || this.matchesKeyword(person.keyword, keyword) || this.matchesKeyword(person.relatedEvents.join('、'), keyword); }).slice(0, 30); }

事件搜索逻辑类似，但匹配字段换成事件标题、朝代、时间、简介、影响和相关人物：

private localSearchEvents(): HistoricalEvent[] { let keyword: string = this.normalizedSearchKeyword(); if (keyword === '') { return FULL_HISTORICAL_EVENTS.slice(0, 8); } return FULL_HISTORICAL_EVENTS.filter((event: HistoricalEvent) => { return this.matchesKeyword(event.title, keyword) || this.matchesKeyword(event.dynasty, keyword) || this.matchesKeyword(event.time, keyword) || this.matchesKeyword(event.summary, keyword) || this.matchesKeyword(event.impact, keyword) || this.matchesKeyword(event.keyword, keyword) || this.matchesKeyword(event.people.join('、'), keyword); }).slice(0, 30); }

搜索结果不是混排，而是按类型分组展示：

朝代；
人物；
事件；
资料。

这样用户搜索“秦”时，可以看到秦朝、秦始皇、秦统一六国和秦代资料，但每类内容边界清晰。

七、朝代聚合：把碎片内容组织成历史脉络

历史学习不能只看单个知识点，还要看时代关系。

项目中的朝代数据结构如下：

export interface DynastyInfo { name: string; period: string; desc: string; }

当用户进入“朝代馆”后，应用会根据当前朝代动态筛选人物和事件：

private selectedDynastyPeople(): HistoricalPerson[] { return FULL_HISTORICAL_PEOPLE.filter((person: HistoricalPerson) => { return this.isDynastyInScope(person.dynasty, this.selectedDynasty); }); } private selectedDynastyEvents(): HistoricalEvent[] { return FULL_HISTORICAL_EVENTS.filter((event: HistoricalEvent) => { return this.isDynastyInScope(event.dynasty, this.selectedDynasty); }); }

这样一个朝代页就可以同时展示：

朝代简介；
历史脉络；
朝代事件；
代表人物；
相关内容。

这其实是一种轻量级知识组织方式，不需要引入数据库，也能让用户从“人物、事件、朝代”三个维度理解历史。

八、学习行为状态管理

项目使用 ArkUI 的 @State 管理页面交互状态：

@State viewedPersonNames: string[] = []; @State viewedEventTitles: string[] = []; @State studiedDynastyNames: string[] = []; @State collectedPersonNames: string[] = []; @State localNotes: string[] = [];

当用户查看人物、事件或朝代时，会加入最近学习记录：

private addRecentStudy(type: string, title: string, desc: string) { // 将学习记录加入 recentStudies }

这些状态可以用于：

最近学习；
人物收藏；
浏览记录；
学习笔记；
成就统计。

虽然目前这是页面级状态，但已经形成了后续接入持久化存储的基础结构。