当前位置:   article > 正文

HarmonyOS 应用程序入口Ability与页面路由_页面路由需要导入以下哪个模块

页面路由需要导入以下哪个模块

需求描述

Stage模型下的Ability开发,实现Ability内页面间的跳转和数据传递

注:本文的 API 基于 Stage模型 和 HarmonyOS 3.1 Developer Preview 

页面效果

    

Ability概述

Ability框架概述-Ability开发-开发-HarmonyOS应用开发

 

Ability内页面跳转和数据传递

Ability的数据传递包括有Ability内页面的跳转和数据传递、Ability间的数据跳转和数据传递

页面路由,需要导入router模块,如下代码所示。

import router from '@ohos.router';

页面路由使用方法请参考官方文档

@ohos.router (页面路由)https://developer.harmonyos.com/cn/docs/documentation/doc-references/js-apis-router-0000001333321105#ZH-CN_TOPIC_0000001333321105__routeroptions

  • router.clear() 方法清除页面栈中的所有历史页面,仅保留当前页面作为栈顶页面。 
  • API9及以上,router.push() 方法新增了mode参数,可以将mode参数配置为 router.RouterMode.Single 单实例模式和 router.RouterMode.Standard 标准模式。
    在单实例模式下:如果目标页面的url在页面栈中已经存在同url页面,离栈顶最近的同url页面会被移动到栈顶,移动后的页面为新建页,原来的页面仍然存在栈中,页面栈数量不变;如果目标页面的url在页面栈中不存在同url页面,按标准模式跳转,页面栈数量会加1。

代码实例

Index.ets

  1. import router from '@ohos.router';
  2. @Entry
  3. @Component
  4. struct Index {
  5. @State message: string = '第一页'
  6. @State dataFromIndex: string = ''
  7. @State dataFromSecond: string = ''
  8. onPageShow() {
  9. this.dataFromSecond = router.getParams()?.['dataFromSecond']
  10. }
  11. build() {
  12. Row() {
  13. Column() {
  14. Text(this.message)
  15. .fontSize(50)
  16. .fontWeight(FontWeight.Bold)
  17. Text('传递给第二页的数据:')
  18. .margin({ top: 16 })
  19. .fontSize(20)
  20. .fontWeight(FontWeight.Bold)
  21. TextInput()
  22. .width('95%')
  23. .onChange((value) => {
  24. this.dataFromIndex = value
  25. })
  26. Text('从第二页返回的数据:')
  27. .margin({ top: 16 })
  28. .fontSize(20)
  29. .fontWeight(FontWeight.Bold)
  30. Text(this.dataFromSecond)
  31. .fontSize(20)
  32. .fontColor(Color.Green)
  33. Button('下一页')
  34. .width('50%')
  35. .margin({ top: 16 })
  36. .onClick(() => {
  37. router.push({
  38. url: 'pages/Second',
  39. params: {
  40. dataFromIndex: this.dataFromIndex
  41. }
  42. })
  43. })
  44. }
  45. .width('100%')
  46. }
  47. .height('100%')
  48. }
  49. }

Second.ets

  1. import router from '@ohos.router';
  2. @Entry
  3. @Component
  4. struct Second {
  5. @State message: string = '第二页'
  6. @State dataFromIndex: string = router.getParams()?.['dataFromIndex']
  7. build() {
  8. Row() {
  9. Column() {
  10. Text(this.message)
  11. .fontSize(50)
  12. .fontWeight(FontWeight.Bold)
  13. Text(this.dataFromIndex)
  14. .fontSize(20)
  15. .margin({ top: 16 })
  16. .fontColor(Color.Orange)
  17. Button('清除页面栈')
  18. .width('50%')
  19. .margin({ top: 16 })
  20. .onClick(() => {
  21. router.clear()
  22. })
  23. Button('跳转第一页\n单实例模式')
  24. .width('50%')
  25. .margin({ top: 16 })
  26. .onClick(() => {
  27. router.push({
  28. url: 'pages/Index',
  29. params: {
  30. dataFromSecond: '单例模式跳转的数据'
  31. }
  32. }, router.RouterMode.Single)
  33. })
  34. Button('返回')
  35. .width('50%')
  36. .margin({ top: 16 })
  37. .onClick(() => {
  38. router.back({
  39. url: 'pages/Index',
  40. params: {
  41. dataFromSecond: '直接返回的数据'
  42. }
  43. })
  44. })
  45. }
  46. .width('100%')
  47. }
  48. .height('100%')
  49. }
  50. }

参考

华为开发者学堂

Ability框架概述-Ability开发-开发-HarmonyOS应用开发

ohos.router (页面路由)

声明:本文内容由网友自发贡献,不代表【wpsshop博客】立场,版权归原作者所有,本站不承担相应法律责任。如您发现有侵权的内容,请联系我们。转载请注明出处:https://www.wpsshop.cn/w/小丑西瓜9/article/detail/167964
推荐阅读
相关标签
  

闽ICP备14008679号