HarmonyOS 鸿蒙Next中页面跳转

HarmonyOS 鸿蒙Next中页面跳转 做了一个index.ets单界面能跑起来，现在想增加一个界面，做了好几次都无法衔接，请问是直接在这个界面里修改还是另外做一个界面和这个界面进行跳转呢。

3 回复

建议写在另外一个文件，跳转可以试试router路由（不推荐，仅学习） https://developer.huawei.com/consumer/cn/doc/harmonyos-references/js-apis-system-router#routerpush 熟练页面跳转了再换成navigation路由（也可以直接学习使用这个路由） https://developer.huawei.com/consumer/cn/doc/harmonyos-guides/arkts-navigation-navigation

更多关于HarmonyOS 鸿蒙Next中页面跳转的实战系列教程也可以访问 https://www.itying.com/category-93-b0.html


在HarmonyOS Next中，页面跳转通过页面路由模块router实现。使用router.pushUrl()方法跳转到指定页面，支持标准模式和单实例模式。通过router.back()返回上一页面。页面路由需在config.json中注册路由信息。页面间传递参数使用params对象，通过键值对形式传递数据。

在HarmonyOS Next中，建议通过新增一个独立的界面文件（例如second.ets）来实现页面跳转，而不是在index.ets中直接修改。以下是具体步骤：

  1. 创建新页面：在src/main/ets/pages目录下新建second.ets，编写UI和逻辑代码。
  2. 配置路由：在src/main/resources/base/profile/main_pages.json中注册新页面路径，例如添加"pages/second"。
  3. 实现跳转：在index.ets中使用router.pushUrl()方法跳转，例如：
    import router from '[@ohos](/user/ohos).router';
// 触发跳转事件
router.pushUrl({ url: 'pages/second' });
  4. 返回处理：在second.ets中可通过router.back()返回上一页。

这种方式符合鸿蒙的页面路由机制，便于维护和扩展。

回到顶部