NAVIGATION使用实例
Navigation 组件扮演着核心导航容器的角色，主要实现以下功能：
1. 页面导航管理
- 导航栈管理：通过
NavPathStack实例 (pageInfos) 管理页面的导航状态和历史记录 - 子页面切换：支持在不同子页面之间进行切换和导航
- 页面跳转：通过
pushPath方法实现从首页跳转到子页面
-
2. UI 结构组织
- 标题栏：通过
.title('设置中心')设置顶部标题 - 主内容区域：包含搜索框和设置项列表
- 菜单：通过
.menus()方法添加底部菜单选项 - 工具栏：通过
.toolbarConfiguration()配置顶部工具栏
3. 子页面注册与构建
- 子页面注册：通过
.navDestination(this.PageMap)注册子页面构建器 - 动态页面创建：根据路径名称动态创建对应的子页面
- 页面内容定义：通过
pageOneTmp、pageTwoTmp、pageThreeTmp等组件定义子页面内容
4. 交互流程
- 初始状态：显示带有搜索框和设置项列表的首页
- 用户操作：点击列表中的设置项（如"网络设置"）
- 导航触发：调用
this.pageInfos.pushPath({ name: 'NavDestinationTitle' + item.id }) - 页面切换：Navigation 组件根据路径名称创建并显示对应的子页面
- 返回机制：子页面自动包含返回按钮，可返回上一页
5. 技术特点
- 声明式导航：使用构建器模式声明子页面
- 路径映射：通过路径名称映射到对应的子页面组件
- 状态管理：通过 NavPathStack 管理导航状态
- UI 定制：支持自定义标题、菜单和工具栏
代码示例分析
导航栈初始化
pageInfos:NavPathStack=newNavPathStac
