DevEco Studio 实现 HarmonyOS 双页面跳转完整教程
2026/6/10 15:22:39 网站建设 项目流程

一、开发环境与前置准备

  • 开发工具:DevEco Studio(推荐 4.0+ 版本)
  • 开发语言:ArkTS(声明式开发范式)
  • 核心依赖:@ohos.router路由模块(系统内置,无需额外安装)

二、创建项目与页面

创建两个页面

  • 项目默认自带Index.ets页面(首页)
  • 右键entry/src/main/ets/pages文件夹 →NewPageEmpty Page,命名为Second.ets(跳转目标页)
  • 系统会自动在main_pages.json中配置路由,无需手动修改路径。

三、核心代码实现

1. 首页Index.ets(页面 1)

实现「点击按钮跳转到第二页」的功能,使用router.pushUrl()方法入栈跳转。

2. 目标页Second.ets(页面 2)

实现「点击按钮返回首页」的功能,使用router.back()方法出栈返回。

四、关键知识点解析

表格

方法作用场景
router.pushUrl()将目标页面加入页面栈,当前页面保留需返回上一页的场景(如列表→详情)
router.back()从页面栈弹出当前页面,返回上一页从详情页返回列表页
router.replaceUrl()替换当前页面,不保留栈记录无需返回的场景(如启动页→首页)

五、运行与测试

  1. 连接模拟器或真机设备,点击 DevEco Studio 右上角的「运行」按钮
  2. 应用启动后,首页会显示「跳转到第二页」按钮
  3. 点击按钮后,会跳转到第二页;点击第二页的「返回首页」按钮,即可回到首页

需要专业的网站建设服务?

联系我们获取免费的网站建设咨询和方案报价,让我们帮助您实现业务目标

立即咨询