harmony 鸿蒙@ohos.router (页面路由)

  • 2022-08-09
  • 浏览 (2123)

@ohos.router (页面路由)

本模块提供通过不同的url访问不同的页面，包括跳转到应用内的指定页面、同应用内的某个页面替换当前页面、返回上一页面或指定的页面等。

说明

  • 本模块首批接口从API version 8开始支持。后续版本的新增接口，采用上角标单独标记接口的起始版本。

  • 页面路由需要在页面渲染完成之后才能调用，在onInit和onReady生命周期中页面还处于渲染阶段，禁止调用页面路由方法。

  • 本模块功能依赖UI的执行上下文，不可在UI上下文不明确的地方使用，参见UIContext说明。

  • 从API version 10开始，可以通过使用UIContext中的getRouter方法获取当前UI上下文关联的Router对象。

  • 为了实现更好的转场效果，推荐使用Navigation组件和模态转场。

导入模块

import router from '@ohos.router'

router.pushUrl9+

pushUrl(options: RouterOptions): Promise<void>

跳转到应用内的指定页面。

系统能力： SystemCapability.ArkUI.ArkUI.Full

参数：

参数名 类型 必填 说明
options RouterOptions 是 跳转页面描述信息。

返回值：

类型 说明
Promise<void> 异常返回结果。

错误码：

以下错误码的详细介绍请参见ohos.router(页面路由)错误码。

错误码ID 错误信息
100001 if UI execution context not found.
100002 if the uri is not exist.
100003 if the pages are pushed too much.

示例：

import { BusinessError } from '@ohos.base';

class innerParams {
  data3:number[]

  constructor(tuple:number[]) {
    this.data3 = tuple
  }
}

class routerParams {
  data1:string
  data2:innerParams

  constructor(str:string, tuple:number[]) {
    this.data1 = str
    this.data2 = new innerParams(tuple)
  }
}

try {
  router.pushUrl({
    url: 'pages/routerpage2',
    params: new routerParams('message' ,[123,456,789])
  })
} catch (err) {
  console.error(`pushUrl failed, code is ${(err as BusinessError).code}, message is ${(err as BusinessError).message}`);
}

router.pushUrl9+

pushUrl(options: RouterOptions, callback: AsyncCallback<void>): void

跳转到应用内的指定页面。

系统能力： SystemCapability.ArkUI.ArkUI.Full

参数：

参数名 类型 必填 说明
options RouterOptions 是 跳转页面描述信息。
callback AsyncCallback<void> 是 异常响应回调。

错误码：

以下错误码的详细介绍请参见ohos.router(页面路由)错误码。

错误码ID 错误信息
100001 if UI execution context not found.
100002 if the uri is not exist.
100003 if the pages are pushed too much.

示例：

class innerParams {
  data3:number[]

  constructor(tuple:number[]) {
    this.data3 = tuple
  }
}

class routerParams {
  data1:string
  data2:innerParams

  constructor(str:string, tuple:number[]) {
    this.data1 = str
    this.data2 = new innerParams(tuple)
  }
}

router.pushUrl({
  url: 'pages/routerpage2',
  params: new routerParams('message' ,[123,456,789])
}, (err) => {
  if (err) {
    console.error(`pushUrl failed, code is ${err.code}, message is ${err.message}`);
    return;
  }
  console.info('pushUrl success');
})

router.pushUrl9+

pushUrl(options: RouterOptions, mode: RouterMode): Promise<void>

跳转到应用内的指定页面。

系统能力： SystemCapability.ArkUI.ArkUI.Full

参数：

参数名 类型 必填 说明
options RouterOptions 是 跳转页面描述信息。
mode RouterMode 是 跳转页面使用的模式。

返回值：

类型 说明
Promise<void> 异常返回结果。

错误码：

以下错误码的详细介绍请参见ohos.router(页面路由)错误码。

错误码ID 错误信息
100001 if UI execution context not found.
100002 if the uri is not exist.
100003 if the pages are pushed too much.

示例：

import { BusinessError } from '@ohos.base';

class innerParams {
  data3:number[]

  constructor(tuple:number[]) {
    this.data3 = tuple
  }
}

class routerParams {
  data1:string
  data2:innerParams

  constructor(str:string, tuple:number[]) {
    this.data1 = str
    this.data2 = new innerParams(tuple)
  }
}

try {
  router.pushUrl({
    url: 'pages/routerpage2',
    params: new routerParams('message' ,[123,456,789])
  }, router.RouterMode.Standard)
} catch (err) {
  console.error(`pushUrl failed, code is ${(err as BusinessError).code}, message is ${(err as BusinessError).message}`);
}

router.pushUrl9+

pushUrl(options: RouterOptions, mode: RouterMode, callback: AsyncCallback<void>): void

跳转到应用内的指定页面。

系统能力： SystemCapability.ArkUI.ArkUI.Full

参数：

参数名 类型 必填 说明
options RouterOptions 是 跳转页面描述信息。
mode RouterMode 是 跳转页面使用的模式。
callback AsyncCallback<void> 是 异常响应回调。

错误码：

以下错误码的详细介绍请参见ohos.router(页面路由)错误码。

错误码ID 错误信息
100001 if UI execution context not found.
100002 if the uri is not exist.
100003 if the pages are pushed too much.

示例：

class innerParams {
  data3:number[]

  constructor(tuple:number[]) {
    this.data3 = tuple
  }
}

class routerParams {
  data1:string
  data2:innerParams

  constructor(str:string, tuple:number[]) {
    this.data1 = str
    this.data2 = new innerParams(tuple)
  }
}

router.pushUrl({
  url: 'pages/routerpage2',
  params: new routerParams('message' ,[123,456,789])
}, router.RouterMode.Standard, (err) => {
  if (err) {
    console.error(`pushUrl failed, code is ${err.code}, message is ${err.message}`);
    return;
  }
  console.info('pushUrl success');
})

router.replaceUrl9+

replaceUrl(options: RouterOptions): Promise<void>

用应用内的某个页面替换当前页面，并销毁被替换的页面。不支持设置页面转场动效，如需设置，推荐使用Navigation组件。

系统能力： SystemCapability.ArkUI.ArkUI.Lite

参数：

参数名 类型 必填 说明
options RouterOptions 是 替换页面描述信息。

返回值：

类型 说明
Promise<void> 异常返回结果。

错误码：

以下错误码的详细介绍请参见ohos.router(页面路由)错误码。

错误码ID 错误信息
100001 if UI execution context not found, only throw in standard system.
200002 if the uri is not exist.

示例：

import { BusinessError } from '@ohos.base';

class routerParams {
  data1:string

  constructor(str:string) {
    this.data1 = str
  }
}

try {
  router.replaceUrl({
    url: 'pages/detail',
    params: new routerParams('message')
  })
} catch (err) {
  console.error(`replaceUrl failed, code is ${(err as BusinessError).code}, message is ${(err as BusinessError).message}`);
}

router.replaceUrl9+

replaceUrl(options: RouterOptions, callback: AsyncCallback<void>): void

用应用内的某个页面替换当前页面，并销毁被替换的页面。

系统能力： SystemCapability.ArkUI.ArkUI.Lite

参数：

参数名 类型 必填 说明
options RouterOptions 是 替换页面描述信息。
callback AsyncCallback<void> 是 异常响应回调。

错误码：

以下错误码的详细介绍请参见ohos.router(页面路由)错误码。

错误码ID 错误信息
100001 if UI execution context not found, only throw in standard system.
200002 if the uri is not exist.

示例：

class routerParams {
  data1:string

  constructor(str:string) {
    this.data1 = str
  }
}

router.replaceUrl({
  url: 'pages/detail',
  params: new routerParams('message')
}, (err) => {
  if (err) {
    console.error(`replaceUrl failed, code is ${err.code}, message is ${err.message}`);
    return;
  }
  console.info('replaceUrl success');
})

router.replaceUrl9+

replaceUrl(options: RouterOptions, mode: RouterMode): Promise<void>

用应用内的某个页面替换当前页面，并销毁被替换的页面。

系统能力： SystemCapability.ArkUI.ArkUI.Lite

参数：

参数名 类型 必填 说明
options RouterOptions 是 替换页面描述信息。
mode RouterMode 是 跳转页面使用的模式。

返回值：

类型 说明
Promise<void> 异常返回结果。

错误码：

以下错误码的详细介绍请参见ohos.router(页面路由)错误码。

错误码ID 错误信息
100001 if can not get the delegate, only throw in standard system.
200002 if the uri is not exist.

示例：

import { BusinessError } from '@ohos.base';

class routerParams {
  data1:string

  constructor(str:string) {
    this.data1 = str
  }
}

try {
  router.replaceUrl({
    url: 'pages/detail',
    params: new routerParams('message')
  }, router.RouterMode.Standard)
} catch (err) {
  console.error(`replaceUrl failed, code is ${(err as BusinessError).code}, message is ${(err as BusinessError).message}`);
}

router.replaceUrl9+

replaceUrl(options: RouterOptions, mode: RouterMode, callback: AsyncCallback<void>): void

用应用内的某个页面替换当前页面，并销毁被替换的页面。

系统能力： SystemCapability.ArkUI.ArkUI.Lite

参数：

参数名 类型 必填 说明
options RouterOptions 是 替换页面描述信息。
mode RouterMode 是 跳转页面使用的模式。
callback AsyncCallback<void> 是 异常响应回调。

错误码：

以下错误码的详细介绍请参见ohos.router(页面路由)错误码。

错误码ID 错误信息
100001 if UI execution context not found, only throw in standard system.
200002 if the uri is not exist.

示例：

class routerParams {
  data1:string

  constructor(str:string) {
    this.data1 = str
  }
}

router.replaceUrl({
  url: 'pages/detail',
  params: new routerParams('message')
}, router.RouterMode.Standard, (err) => {
  if (err) {
    console.error(`replaceUrl failed, code is ${err.code}, message is ${err.message}`);
    return;
  }
  console.info('replaceUrl success');
});

router.pushNamedRoute10+

pushNamedRoute(options: NamedRouterOptions): Promise<void>

跳转到指定的命名路由页面。

系统能力： SystemCapability.ArkUI.ArkUI.Full

参数：

参数名 类型 必填 说明
options NamedRouterOptions 是 跳转页面描述信息。

返回值：

类型 说明
Promise<void> 异常返回结果。

错误码：

以下错误码的详细介绍请参见ohos.router(页面路由)错误码。

错误码ID 错误信息
100001 if UI execution context not found.
100003 if the pages are pushed too much.
100004 if the named route is not exist.

示例：

import { BusinessError } from '@ohos.base';

class innerParams {
  data3:number[]

  constructor(tuple:number[]) {
    this.data3 = tuple
  }
}

class routerParams {
  data1:string
  data2:innerParams

  constructor(str:string, tuple:number[]) {
    this.data1 = str
    this.data2 = new innerParams(tuple)
  }
}

try {
  router.pushNamedRoute({
    name: 'myPage',
    params: new routerParams('message' ,[123,456,789])
  })
} catch (err) {
  console.error(`pushNamedRoute failed, code is ${(err as BusinessError).code}, message is ${(err as BusinessError).message}`);
}

详细示例请参考：UI开发-页面路由

router.pushNamedRoute10+

pushNamedRoute(options: NamedRouterOptions, callback: AsyncCallback<void>): void

跳转到指定的命名路由页面。

系统能力： SystemCapability.ArkUI.ArkUI.Full

参数：

参数名 类型 必填 说明
options NamedRouterOptions 是 跳转页面描述信息。
callback AsyncCallback<void> 是 异常响应回调。

错误码：

以下错误码的详细介绍请参见ohos.router(页面路由)错误码。

错误码ID 错误信息
100001 if UI execution context not found.
100003 if the pages are pushed too much.
100004 if the named route is not exist.

示例：

class innerParams {
  data3:number[]

  constructor(tuple:number[]) {
    this.data3 = tuple
  }
}

class routerParams {
  data1:string
  data2:innerParams

  constructor(str:string, tuple:number[]) {
    this.data1 = str
    this.data2 = new innerParams(tuple)
  }
}

router.pushNamedRoute({
  name: 'myPage',
  params: new routerParams('message' ,[123,456,789])
}, (err) => {
  if (err) {
    console.error(`pushNamedRoute failed, code is ${err.code}, message is ${err.message}`);
    return;
  }
  console.info('pushNamedRoute success');
})

router.pushNamedRoute10+

pushNamedRoute(options: NamedRouterOptions, mode: RouterMode): Promise<void>

跳转到指定的命名路由页面。

系统能力： SystemCapability.ArkUI.ArkUI.Full

参数：

参数名 类型 必填 说明
options NamedRouterOptions 是 跳转页面描述信息。
mode RouterMode 是 跳转页面使用的模式。

返回值：

类型 说明
Promise<void> 异常返回结果。

错误码：

以下错误码的详细介绍请参见ohos.router(页面路由)错误码。

错误码ID 错误信息
100001 if UI execution context not found.
100003 if the pages are pushed too much.
100004 if the named route is not exist.

示例：

import { BusinessError } from '@ohos.base';

class innerParams {
  data3:number[]

  constructor(tuple:number[]) {
    this.data3 = tuple
  }
}

class routerParams {
  data1:string
  data2:innerParams

  constructor(str:string, tuple:number[]) {
    this.data1 = str
    this.data2 = new innerParams(tuple)
  }
}

try {
  router.pushNamedRoute({
    name: 'myPage',
    params: new routerParams('message' ,[123,456,789])
  }, router.RouterMode.Standard)
} catch (err) {
  console.error(`pushNamedRoute failed, code is ${(err as BusinessError).code}, message is ${(err as BusinessError).message}`);
}

router.pushNamedRoute10+

pushNamedRoute(options: NamedRouterOptions, mode: RouterMode, callback: AsyncCallback<void>): void

跳转到指定的命名路由页面。

系统能力： SystemCapability.ArkUI.ArkUI.Full

参数：

参数名 类型 必填 说明
options NamedRouterOptions 是 跳转页面描述信息。
mode RouterMode 是 跳转页面使用的模式。
callback AsyncCallback<void> 是 异常响应回调。

错误码：

以下错误码的详细介绍请参见ohos.router(页面路由)错误码。

错误码ID 错误信息
100001 if UI execution context not found.
100003 if the pages are pushed too much.
100004 if the named route is not exist.

示例：

class innerParams {
  data3:number[]

  constructor(tuple:number[]) {
    this.data3 = tuple
  }
}

class routerParams {
  data1:string
  data2:innerParams

  constructor(str:string, tuple:number[]) {
    this.data1 = str
    this.data2 = new innerParams(tuple)
  }
}

router.pushNamedRoute({
  name: 'myPage',
  params: new routerParams('message' ,[123,456,789])
}, router.RouterMode.Standard, (err) => {
  if (err) {
    console.error(`pushNamedRoute failed, code is ${err.code}, message is ${err.message}`);
    return;
  }
  console.info('pushNamedRoute success');
})

router.replaceNamedRoute10+

replaceNamedRoute(options: NamedRouterOptions): Promise<void>

用指定的命名路由页面替换当前页面，并销毁被替换的页面。

系统能力： SystemCapability.ArkUI.ArkUI.Full

参数：

参数名 类型 必填 说明
options NamedRouterOptions 是 替换页面描述信息。

返回值：

类型 说明
Promise<void> 异常返回结果。

错误码：

以下错误码的详细介绍请参见ohos.router(页面路由)错误码。

错误码ID 错误信息
100001 if UI execution context not found, only throw in standard system.
100004 if the named route is not exist.

示例：

import { BusinessError } from '@ohos.base';

class routerParams {
  data1:string

  constructor(str:string) {
    this.data1 = str
  }
}

try {
  router.replaceNamedRoute({
    name: 'myPage',
    params: new routerParams('message')
  })
} catch (err) {
  console.error(`replaceNamedRoute failed, code is ${(err as BusinessError).code}, message is ${(err as BusinessError).message}`);
}

router.replaceNamedRoute10+

replaceNamedRoute(options: NamedRouterOptions, callback: AsyncCallback<void>): void

用指定的命名路由页面替换当前页面，并销毁被替换的页面。

系统能力： SystemCapability.ArkUI.ArkUI.Full

参数：

参数名 类型 必填 说明
options NamedRouterOptions 是 替换页面描述信息。
callback AsyncCallback<void> 是 异常响应回调。

错误码：

以下错误码的详细介绍请参见ohos.router(页面路由)错误码。

错误码ID 错误信息
100001 if UI execution context not found, only throw in standard system.
100004 if the named route is not exist.

示例：

class routerParams {
  data1:string

  constructor(str:string) {
    this.data1 = str
  }
}

router.replaceNamedRoute({
  name: 'myPage',
  params: new routerParams('message')
}, (err) => {
  if (err) {
    console.error(`replaceNamedRoute failed, code is ${err.code}, message is ${err.message}`);
    return;
  }
  console.info('replaceNamedRoute success');
})

router.replaceNamedRoute10+

replaceNamedRoute(options: NamedRouterOptions, mode: RouterMode): Promise<void>

用指定的命名路由页面替换当前页面，并销毁被替换的页面。

系统能力： SystemCapability.ArkUI.ArkUI.Full

参数：

参数名 类型 必填 说明
options NamedRouterOptions 是 替换页面描述信息。
mode RouterMode 是 跳转页面使用的模式。

返回值：

类型 说明
Promise<void> 异常返回结果。

错误码：

以下错误码的详细介绍请参见ohos.router(页面路由)错误码。

错误码ID 错误信息
100001 if can not get the delegate, only throw in standard system.
100004 if the named route is not exist.

示例：

import { BusinessError } from '@ohos.base';

class routerParams {
  data1:string

  constructor(str:string) {
    this.data1 = str
  }
}

try {
  router.replaceNamedRoute({
    name: 'myPage',
    params: new routerParams('message')
  }, router.RouterMode.Standard)
} catch (err) {
  console.error(`replaceNamedRoute failed, code is ${(err as BusinessError).code}, message is ${(err as BusinessError).message}`);
}

router.replaceNamedRoute10+

replaceNamedRoute(options: NamedRouterOptions, mode: RouterMode, callback: AsyncCallback<void>): void

用指定的命名路由页面替换当前页面，并销毁被替换的页面。

系统能力： SystemCapability.ArkUI.ArkUI.Full

参数：

参数名 类型 必填 说明
options NamedRouterOptions 是 替换页面描述信息。
mode RouterMode 是 跳转页面使用的模式。
callback AsyncCallback<void> 是 异常响应回调。

错误码：

以下错误码的详细介绍请参见ohos.router(页面路由)错误码。

错误码ID 错误信息
100001 if UI execution context not found, only throw in standard system.
100004 if the named route is not exist.

示例：

class routerParams {
  data1:string

  constructor(str:string) {
    this.data1 = str
  }
}

router.replaceNamedRoute({
  name: 'myPage',
  params: new routerParams('message')
}, router.RouterMode.Standard, (err) => {
  if (err) {
    console.error(`replaceNamedRoute failed, code is ${err.code}, message is ${err.message}`);
    return;
  }
  console.info('replaceNamedRoute success');
});

router.back

back(options?: RouterOptions ): void

返回上一页面或指定的页面。

系统能力： SystemCapability.ArkUI.ArkUI.Full

参数：

参数名 类型 必填 说明
options RouterOptions 否 返回页面描述信息，其中参数url指路由跳转时会返回到指定url的界面，如果页面栈上没有url页面，则不响应该情况。如果url未设置，则返回上一页，页面不会重新构建，页面栈里面的page不会回收，出栈后会被回收。

示例：

router.back({url:'pages/detail'});

router.clear

clear(): void

清空页面栈中的所有历史页面，仅保留当前页面作为栈顶页面。

系统能力： SystemCapability.ArkUI.ArkUI.Full

示例：

router.clear();

router.getLength

getLength(): string

获取当前在页面栈内的页面数量。

系统能力： SystemCapability.ArkUI.ArkUI.Full

返回值：

类型 说明
string 页面数量，页面栈支持最大数值是32。

示例：

let size = router.getLength();        
console.log('pages stack size = ' + size);

router.getState

getState(): RouterState

获取当前页面的状态信息。

系统能力： SystemCapability.ArkUI.ArkUI.Full

返回值：

类型 说明
RouterState 页面状态信息。

示例：

let page = router.getState();
console.log('current index = ' + page.index);
console.log('current name = ' + page.name);
console.log('current path = ' + page.path);

RouterState

页面状态信息。

系统能力： SystemCapability.ArkUI.ArkUI.Full。

名称 类型 必填 说明
index number 是 表示当前页面在页面栈中的索引。从栈底到栈顶，index从1开始递增。
name string 否 表示当前页面的名称，即对应文件名。
path string 是 表示当前页面的路径。

router.showAlertBeforeBackPage9+

showAlertBeforeBackPage(options: EnableAlertOptions): void

开启页面返回询问对话框。

系统能力： SystemCapability.ArkUI.ArkUI.Full

参数：

参数名 类型 必填 说明
options EnableAlertOptions 是 文本弹窗信息描述。

错误码：

以下错误码的详细介绍请参见ohos.router(页面路由)错误码。

错误码ID 错误信息
100001 if UI execution context not found.

示例：

import { BusinessError } from '@ohos.base';

try {
  router.showAlertBeforeBackPage({
    message: 'Message Info'
  });
} catch(err) {
  console.error(`showAlertBeforeBackPage failed, code is ${(err as BusinessError).code}, message is ${(err as BusinessError).message}`);
}

EnableAlertOptions

页面返回询问对话框选项。

系统能力： 以下各项对应的系统能力均为SystemCapability.ArkUI.ArkUI.Full。

名称 类型 必填 说明
message string 是 询问对话框内容。

router.hideAlertBeforeBackPage9+

hideAlertBeforeBackPage(): void

禁用页面返回询问对话框。

系统能力： SystemCapability.ArkUI.ArkUI.Full

示例：

router.hideAlertBeforeBackPage();

router.getParams

getParams(): Object

获取发起跳转的页面往当前页传入的参数。

系统能力： SystemCapability.ArkUI.ArkUI.Full

返回值：

类型 说明
object 发起跳转的页面往当前页传入的参数。

示例：

router.getParams();

RouterOptions

路由跳转选项。

系统能力： SystemCapability.ArkUI.ArkUI.Lite。

名称 类型 必填 说明
url string 是 表示目标页面的url，可以用以下两种格式：
- 页面绝对路径，由配置文件中pages列表提供，例如：
  - pages/index/index
  - pages/detail/detail
- 特殊值，如果url的值是”/“，则跳转到首页。
params object 否 表示路由跳转时要同时传递到目标页面的数据，切换到其他页面时，当前接收的数据失效。跳转到目标页面后，使用router.getParams()获取传递的参数，此外，在类web范式中，参数也可以在页面中直接使用，如this.keyValue(keyValue为跳转时params参数中的key值)，如果目标页面中已有该字段，则其值会被传入的字段值覆盖。
说明：
params参数不能传递方法和系统接口返回的对象（例如，媒体接口定义和返回的PixelMap对象）。建议开发者提取系统接口返回的对象中需要被传递的基础类型属性，自行构造object类型对象进行传递。

说明： 页面路由栈支持的最大Page数量为32。

RouterMode9+

路由跳转模式。

系统能力： SystemCapability.ArkUI.ArkUI.Full。

名称 说明
Standard 多实例模式，也是默认情况下的跳转模式。
目标页面会被添加到页面栈顶，无论栈中是否存在相同url的页面。
说明： 不使用路由跳转模式时，则按照默认的多实例模式进行跳转。
Single 单实例模式。
如果目标页面的url已经存在于页面栈中，则会将离栈顶最近的同url页面移动到栈顶，该页面成为新建页。
如果目标页面的url在页面栈中不存在同url页面，则按照默认的多实例模式进行跳转。

NamedRouterOptions10+

命名路由跳转选项。

系统能力： SystemCapability.ArkUI.ArkUI.Full

名称 类型 必填 说明
name string 是 表示目标命名路由页面的name。
params object 否 表示路由跳转时要同时传递到目标页面的数据。跳转到目标页面后，使用router.getParams()获取传递的参数，此外，在类web范式中，参数也可以在页面中直接使用，如this.keyValue(keyValue为跳转时params参数中的key值)，如果目标页面中已有该字段，则其值会被传入的字段值覆盖。

完整示例

基于JS扩展的类Web开发范式

以下代码仅适用于javascript文件，不适用于ArkTS文件

// 在当前页面中
export default {
  pushPage() {
    router.push({
      url: 'pages/detail/detail',
      params: {
        data1: 'message'
      }
    });
  }
}

// 在detail页面中
export default {
  onInit() {
    console.info('showData1:' + router.getParams()['data1']);
  }
}

基于TS扩展的声明式开发范式

// 通过router.pushUrl跳转至目标页携带params参数
import router from '@ohos.router'
import { BusinessError } from '@ohos.base'

// 定义传递参数的类
class innerParams {
  array:number[]

  constructor(tuple:number[]) {
    this.array = tuple
  }
}

class routerParams {
  text:string
  data:innerParams

  constructor(str:string, tuple:number[]) {
    this.text = str
    this.data = new innerParams(tuple)
  }
}

@Entry
@Component
struct Index {
  async routePage() {
    let options:router.RouterOptions = {
      url: 'pages/second',
      params: new routerParams('这是第一页的值' ,[12, 45, 78])
    }
    try {
      await router.pushUrl(options)
    } catch (err) {
      console.info(` fail callback, code: ${(err as BusinessError).code}, msg: ${(err as BusinessError).message}`)
    }
  }

  build() {
    Flex({ direction: FlexDirection.Column, alignItems: ItemAlign.Center, justifyContent: FlexAlign.Center }) {
      Text('这是第一页')
        .fontSize(50)
        .fontWeight(FontWeight.Bold)
      Button() {
        Text('next page')
          .fontSize(25)
          .fontWeight(FontWeight.Bold)
      }.type(ButtonType.Capsule)
      .margin({ top: 20 })
      .backgroundColor('#ccc')
      .onClick(() => {
        this.routePage()
      })
    }
    .width('100%')
    .height('100%')
  }
}

// 在second页面中接收传递过来的参数
import router from '@ohos.router'

class innerParams {
  array:number[]

  constructor(tuple:number[]) {
    this.array = tuple
  }
}

class routerParams {
  text:string
  data:innerParams

  constructor(str:string, tuple:number[]) {
    this.text = str
    this.data = new innerParams(tuple)
  }
}

@Entry
@Component
struct Second {
  private content: string = "这是第二页"
  @State text: string = (router.getParams() as routerParams).text
  @State data: object = (router.getParams() as routerParams).data
  @State secondData: string = ''

  build() {
    Flex({ direction: FlexDirection.Column, alignItems: ItemAlign.Center, justifyContent: FlexAlign.Center }) {
      Text(`${this.content}`)
        .fontSize(50)
        .fontWeight(FontWeight.Bold)
      Text(this.text)
        .fontSize(30)
        .onClick(() => {
          this.secondData = (this.data['array'][1]).toString()
        })
        .margin({ top: 20 })
      Text(`第一页传来的数值:${this.secondData}`)
        .fontSize(20)
        .margin({ top: 20 })
        .backgroundColor('red')
    }
    .width('100%')
    .height('100%')
  }
}

router.push(deprecated)

push(options: RouterOptions): void

跳转到应用内的指定页面。

从API version9开始不再维护，建议使用pushUrl9+

系统能力： SystemCapability.ArkUI.ArkUI.Full

参数：

参数名 类型 必填 说明
options RouterOptions 是 跳转页面描述信息。

示例：

class innerParams {
  data3:number[]

  constructor(tuple:number[]) {
    this.data3 = tuple
  }
}

class routerParams {
  data1:string
  data2:innerParams

  constructor(str:string, tuple:number[]) {
    this.data1 = str
    this.data2 = new innerParams(tuple)
  }
}

router.push({
  url: 'pages/routerpage2',
  params: new routerParams('message' ,[123,456,789])
});

router.replace(deprecated)

replace(options: RouterOptions): void

用应用内的某个页面替换当前页面，并销毁被替换的页面。

从API version9开始不再维护，建议使用replaceUrl9+

系统能力： SystemCapability.ArkUI.ArkUI.Lite

参数：

参数名 类型 必填 说明
options RouterOptions 是 替换页面描述信息。

示例：

class routerParams {
  data1:string

  constructor(str:string) {
    this.data1 = str
  }
}

router.replace({
  url: 'pages/detail',
  params: new routerParams('message')
});

router.enableAlertBeforeBackPage(deprecated)

enableAlertBeforeBackPage(options: EnableAlertOptions): void

开启页面返回询问对话框。

从API version9开始不再维护，建议使用showAlertBeforeBackPage9+

系统能力： SystemCapability.ArkUI.ArkUI.Full

参数：

参数名 类型 必填 说明
options EnableAlertOptions 是 文本弹窗信息描述。

示例：

router.enableAlertBeforeBackPage({
  message: 'Message Info'
});

router.disableAlertBeforeBackPage(deprecated)

disableAlertBeforeBackPage(): void

禁用页面返回询问对话框。

从API version9开始不再维护，建议使用hideAlertBeforeBackPage9+

系统能力： SystemCapability.ArkUI.ArkUI.Full

示例：

router.disableAlertBeforeBackPage();

你可能感兴趣的鸿蒙文章

harmony 鸿蒙接口

harmony 鸿蒙系统公共事件定义(待停用)

harmony 鸿蒙系统公共事件定义

harmony 鸿蒙开发说明

harmony 鸿蒙企业设备管理概述（仅对系统应用开放）

harmony 鸿蒙BundleStatusCallback

harmony 鸿蒙@ohos.bundle.innerBundleManager (innerBundleManager模块)

harmony 鸿蒙@ohos.distributedBundle (分布式包管理)

harmony 鸿蒙@ohos.bundle (Bundle模块)

harmony 鸿蒙@ohos.enterprise.EnterpriseAdminExtensionAbility (企业设备管理扩展能力)

0  赞
  • 所属分类： 后端技术
  • 本文标签： 软件 鸿蒙
  • 版权声明： 原创文章如转载，请注明本文链接: https://www.seaxiang.com/blog/80a2a3514626403d9b138d749037773a
热门推荐
标签云
Linux Java Spring Spring Boot docker 大数据 前端 生活 maven golang 软件 spring cloud fintech mac vscode 其他 区块链 以太坊 V神 开发者 技术 股票 git greenplum 分布式事务 chrome mysql flink kafka 设计模式 原理 鸿蒙 seo
最新文章
本文目录