DevEco Studio 实现 HarmonyOS 双页面跳转完整教程
·
一、开发环境与前置准备
- 开发工具：DevEco Studio（推荐 4.0+ 版本）
- 开发语言：ArkTS（声明式开发范式）
- 核心依赖：
@ohos.router路由模块（系统内置，无需额外安装）
二、创建项目与页面
创建两个页面
- 项目默认自带
Index.ets页面（首页） - 右键
entry/src/main/ets/pages文件夹 →New→Page→Empty Page，命名为Second.ets（跳转目标页） - 系统会自动在
main_pages.json中配置路由，无需手动修改路径。
三、核心代码实现
1. 首页 Index.ets（页面 1）
实现「点击按钮跳转到第二页」的功能，使用 router.pushUrl() 方法入栈跳转。
2. 目标页 Second.ets（页面 2）
实现「点击按钮返回首页」的功能，使用 router.back() 方法出栈返回。
四、关键知识点解析
表格
| 方法 | 作用 | 场景 |
|---|---|---|
router.pushUrl() |
将目标页面加入页面栈，当前页面保留 | 需返回上一页的场景（如列表→详情） |
router.back() |
从页面栈弹出当前页面，返回上一页 | 从详情页返回列表页 |
router.replaceUrl() |
替换当前页面，不保留栈记录 | 无需返回的场景（如启动页→首页） |
五、运行与测试
- 连接模拟器或真机设备，点击 DevEco Studio 右上角的「运行」按钮
- 应用启动后，首页会显示「跳转到第二页」按钮
- 点击按钮后，会跳转到第二页；点击第二页的「返回首页」按钮，即可回到首页
讨论HarmonyOS开发技术，专注于API与组件、DevEco Studio、测试、元服务和应用上架分发等。
更多推荐
6
0- 0
已为社区贡献2条内容
所有评论(0)