一、新建鸿蒙项目

1. 打开 DevEco Studio，点击顶部菜单栏「文件」→「新建」→「新建项目」。
2. 在「选择模板」界面，选择「Empty Ability」（空白模板），点击「下一步」。
3. 配置项目信息：
   • 项目名称：自定义（如 PageJumpDemo）
   • 包名：保持默认即可
   • 保存路径：选择你电脑上的文件夹
   • Compatible SDK：选择 API 9 或以上版本
4. 点击「完成」，等待项目初始化完成。

二、创建第二个页面

要实现页面跳转，我们需要两个页面：

• Index.ets：首页，带 “下一页” 按钮
• Second.ets：跳转后的页面，带 “返回上一页” 按钮

1. 在项目中，找到 entry/src/main/ets/pages 文件夹。
2. 右键 pages 文件夹 →「新建」→「ArkTS 文件」，命名为 Second.ets。

三、编写页面代码

1. 首页 Index.ets 代码

这个页面会显示 Hello World 文本和一个 “下一页” 按钮，点击按钮跳转到第二页：

2. 第二页 Second.ets 代码

这个页面会显示跳转成功的文本和 “返回上一页” 按钮，点击按钮回到首页：

四、配置页面路由（关键！）

新建的页面必须在路由配置文件中注册，否则系统找不到页面，会跳转失败。

1. 打开 entry/src/main/resources/base/profile/main_pages.json 文件。
2. 在 src 数组中，添加新页面的路径：

五、运行项目查看效果

1. 打开 DevEco Studio 右侧的「设备管理器」，启动一个模拟器（如 Pura 90）。
2. 点击顶部工具栏的「运行」按钮（绿色三角形），等待项目构建安装。
3. 运行成功后，模拟器上会显示：
   • 首页：Hello World 文本 + 绿色 “下一页” 按钮
   • 点击按钮后，跳转到第二页，显示 “这是第二页！” 文本 + 绿色 “返回上一页” 按钮
   • 点击 “返回上一页”，即可回到首页

常见问题排查

1. 点击按钮没反应

   • 检查 main_pages.json 中是否注册了 pages/Second 页面
   • 检查 Index.ets 中是否引入了 import router from '@ohos.router';
   • 检查跳转路径 url: 'pages/Second' 是否和文件名完全一致（大小写敏感）

2. 报错 Cannot find name 'router'

   • 忘记引入路由模块，在文件顶部加上 import router from '@ohos.router'; 即可。

3. 内容不在屏幕中间

   • 检查 Column 组件是否加了 .width('100%')、.height('100%') 和 .justifyContent(FlexAlign.Center)。