『江鸟中原』HarmonyOS ArkTS Ability内页面的跳转和数据传递
  eiPKd24aIMly 2023年12月11日 21 0

前言

通过这一学期对鸿蒙应用开发的学习,学习到了很多知识,在这里简单的介绍一下我对Ability内页面的理解和应用

学习背景

HarmonyOS ArkTS Ability的数据传递包括有Ability内页面的跳转和数据传递、Ability间的数据跳转和数据传递。今天主要讲解的是Ability内页面的跳转和数据传递。

学习过程

1.新建Ability页面

初始化工程后,会生成以下代码:

·src/main/ets/entryability目录下,初始会生成一个Ability文件EntryAbility.ts。可以在EntryAbility.ts文件中根据业务需要实现Ability的生命周期回调内容。

·在src/main/ets/pages目录下,会生成一个Index页面。这也是基于Ability实现的应用的入口页面。可以在Index页面中根据业务需要实现入口页面的功能。

为了实现页面的跳转和数据传递,需要重新建立一个页面。在src/main/ets/pages目录下,所示右键“New->Page"来新建页面

『江鸟中原』HarmonyOS ArkTS Ability内页面的跳转和数据传递_数据传递

在原有的Index页面的基础上,新建一个页面命名为Second的页面,如下图所示:

『江鸟中原』HarmonyOS ArkTS Ability内页面的跳转和数据传递_数据传递_02

Second页面创建完成后,会自动做两个动作。

一个动作是在src/main/ets/pages目录下,会创建一个Second.ets的文件。文件内容如下:

『江鸟中原』HarmonyOS ArkTS Ability内页面的跳转和数据传递_数据传递_03

另外一个动作是将Second页面信息配置到了src/main/resourse/base/profile/main_pages.josn文件中。main_pages.josn文件内容如下:

『江鸟中原』HarmonyOS ArkTS Ability内页面的跳转和数据传递_当前页_04

2.页面跳转及传参

页面间的导航可以通过页面路由router模块来实现。页面路由模块根据页面url找到目标页面,从而实现跳转。通过页面路由模块,可以使用不同的url访问不同的页面,包括跳转到Ability内的指定页面、用Ability内的某个指定页面替换当前页面、返回上一页面或指定的页面等。通过params来传递参数。

在使用页面路由之前,需要先导入router模块,如以下代码所示:

『江鸟中原』HarmonyOS ArkTS Ability内页面的跳转和数据传递_数据传递_05

页面跳转的几种方式,根据需要选择一种方式跳转即可。

(1)router.push()

通过调用router.push()方法,跳转到Ability内的指定页面。每调用一次router.push()方法均会新建一个页面。在默认情况下,页面栈数量会加1,页面栈支持的最大页面数量为32。

当页面栈数量较大或者超过32时,可以通过调用router.clear()方法清除页面栈中的历史页面,以保留当前页面作为栈顶页面。

用法示例如下:

『江鸟中原』HarmonyOS ArkTS Ability内页面的跳转和数据传递_数据传递_06

(2)router.push()加mode参数

router.push()方法新增mode参数,可将mode参数配置为router.RouterMode.Single单实例模式和router.RouterMode.Standard标准模式。

在单实例模式下,如果目标页面的url在页面栈中已经存在同url页面,离栈顶最近的同url页面会被移到栈顶,移动后的页面为新建页面,原来的页面仍然存在栈中,页面栈数量不变;如果目标页面的url在页面栈中不存在同url页面,按标准模式跳转,页面栈数量会加1.

用法示例如下:

『江鸟中原』HarmonyOS ArkTS Ability内页面的跳转和数据传递_单实例_07

(3)router.replace()

通过调用router.replace()方法,跳转到Ability内的指定页面。即使新的页面替换当前页面,并销毁被替换的当前页面,页面栈数量不变。

(4)router.replace()加mode参数

router.replace()方法新增了mode参数,可以将mode参数配置为router.RouterMode.Single单实例模式和router.RouterMode.Stanard标准模式。

在单实例模式下,如果目标页面的url在页面栈中已经存在同url页面,离栈顶最近的同url页面会被移动到栈顶,替换当前页面,并销毁被替换的当前页面,移动后的页面为新建页,页面栈数量会减1;如果目标页面的url在页面栈中不存在同url页面,按标准模式跳转页面栈数量不变。

用法示例如下:

『江鸟中原』HarmonyOS ArkTS Ability内页面的跳转和数据传递_数据传递_08

最后,在Index.ets文件中添加按钮以触发跳转。Index.ets代码如下:

『江鸟中原』HarmonyOS ArkTS Ability内页面的跳转和数据传递_单实例_09

3.参数接受

通过调用router.getParams()方法获取Index页面传递过来的自定义参数。

『江鸟中原』HarmonyOS ArkTS Ability内页面的跳转和数据传递_数据传递_10

可以调用router.back()方法返回到上一个页面。

最终,完整的Second.ets的代码如下:

『江鸟中原』HarmonyOS ArkTS Ability内页面的跳转和数据传递_当前页_11

4.运行

运行项目后,初始化界面如图所示:

『江鸟中原』HarmonyOS ArkTS Ability内页面的跳转和数据传递_数据传递_12

在Index页面中,点击”跳转“后,即可从Index页面跳转到Second页面,并在Second页面中接受参数和进行页面刷新,界面效果如图所示:

『江鸟中原』HarmonyOS ArkTS Ability内页面的跳转和数据传递_数据传递_13

当在Second页面中点击”返回“后,则会回到Index所示页面。

以上就是完整的页面跳转及传参、接收参数的过程

学习总结

一分耕耘一份收获,上面是我对HarmonyOS ArkTS Ability内页面的跳转和数据传递的理解,还有不足之处,望大家给予批评和指正!

【版权声明】本文内容来自摩杜云社区用户原创、第三方投稿、转载,内容版权归原作者所有。本网站的目的在于传递更多信息,不拥有版权,亦不承担相应法律责任。如果您发现本社区中有涉嫌抄袭的内容,欢迎发送邮件进行举报,并提供相关证据,一经查实,本社区将立刻删除涉嫌侵权内容,举报邮箱: cloudbbs@moduyun.com

  1. 分享:
最后一次编辑于 2023年12月11日 0

暂无评论

推荐阅读
  KNB0gllfEYCN   2023年11月02日   29   0   0 Java当前页分页
  MSmqJL966ONP   2023年11月02日   41   0   0 当前页Python
eiPKd24aIMly