# 页面路由 - [导入模块](#zh-cn_topic_0000001058340511_s0e7b1e85a4274f58a8206e0b065bd80c) - [权限列表](#zh-cn_topic_0000001058340511_section11257113618419) - [router.push\(OBJECT\)](#zh-cn_topic_0000001058340511_s938bf8d664f9475485e83d445c0eeeae) - [router.replace\(OBJECT\)](#zh-cn_topic_0000001058340511_s6d485e6ae3064996a4de2f407bc4287d) - [router.back\(OBJECT\)](#zh-cn_topic_0000001058340511_s3f958a02dde141e69b7f02f22fb2e401) - [router.clear\(\)](#zh-cn_topic_0000001058340511_sa5c3dfd1bb0d4b43906c3d770d6ab2d9) - [router.getLength\(\)](#zh-cn_topic_0000001058340511_s3f121f4005934fda9a1830a909c92c25) - [router.getState\(\)](#zh-cn_topic_0000001058340511_s8843a443a12048e68e33f586aee8dc34) >![](public_sys-resources/icon-notice.gif) **须知:** >页面路由需要在页面渲染完成之后才能调用,在onInit和onReady生命周期中页面还处于渲染阶段,禁止调用页面路由方法。 ## 导入模块 ``` import router from '@system.router'; ``` ## 权限列表 无 ## router.push\(OBJECT\) 跳转到应用内的指定页面。 - 参数

参数名

类型

必填

说明

uri

string

表示目标页面的uri,可以用以下两种格式:

  • 页面绝对路径,由配置文件中pages列表提供,例如:
    • pages/index/index
    • pages/detail/detail
  • 特殊值,如果uri的值是"/",则跳转到首页。

params

Object

跳转时要同时传递到目标页面的数据,跳转到目标页面后,参数可以在页面中直接使用,如this.data1(data1为跳转时params参数中的key值)。如果目标页面中已有该字段,则其值会被传入的字段值覆盖。

- 示例 ``` // 在当前页面中 export default { pushPage() { router.push({ uri: 'pages/routerpage2/routerpage2', params: { data1: 'message', data2: { data3: [123, 456, 789] }, }, }); } } // 在routerpage2页面中 export default { data: { data1: 'default', data2: { data3: [1, 2, 3] } }, onInit() { console.info('showData1:' + this.data1); console.info('showData3:' + this.data2.data3); } } ``` >![](public_sys-resources/icon-note.gif) **说明:** >页面路由栈支持的最大Page数量为32。 ## router.replace\(OBJECT\) 用应用内的某个页面替换当前页面,并销毁被替换的页面。 - 参数

参数名

类型

必填

说明

uri

string

目标页面的uri,可以是以下的两种格式:

  • 页面绝对路径,由配置文件中pages列表提供,例如:
    • pages/index/index
    • pages/detail/detail
  • 特殊值,如果uri的值是"/",则跳转到首页。

params

Object

跳转时要同时传递到目标页面的数据,跳转到目标页面后,参数可以在页面中直接使用,如this.data1(data1为跳转时params参数中的key值)。如果目标页面中已有该字段,则其值会被传入的字段值覆盖。

- 示例 ``` // 在当前页面中 export default { replacePage() { router.replace({ uri: 'pages/detail/detail', params: { data1: 'message', }, }); } } // 在detail页面中 export default { data: { data1: 'default' }, onInit() { console.info('showData1:' + this.data1) } } ``` ## router.back\(OBJECT\) 返回上一页面或指定的页面。 - 参数

参数名

类型

必填

说明

uri

string

返回到指定uri的界面,如果页面栈上没有uri页面,则不响应该情况。如果uri未设置,则返回上一页。

- 示例 ``` // index页面 router.push({ uri: 'pages/detail/detail', }); // detail页面 router.push({ uri: 'pages/mall/mall', }); // mall页面通过back,将返回detail页面 router.back(); // detail页面通过back,将返回index页面 router.back(); // 通过back,返回到detail页面 router.back({uri:'pages/detail/detail'}); ``` >![](public_sys-resources/icon-note.gif) **说明:** >示例中的uri字段是页面路由,由配置文件中的pages列表指定。 ## router.clear\(\) 清空页面栈中的所有历史页面,仅保留当前页面作为栈顶页面。 - 参数 无。 - 示例 ``` router.clear(); ``` ## router.getLength\(\) 获取当前在页面栈内的页面数量。 - 返回值

类型

说明

string

页面数量,页面栈支持最大数值是32。

- 示例 ``` var size = router.getLength(); console.log('pages stack size = ' + size); ``` ## router.getState\(\) 获取当前页面的状态信息。 - 返回值

参数名

类型

说明

index

number

表示当前页面在页面栈中的索引。

说明:

从栈底到栈顶,index从1开始递增。

name

string

表示当前页面的名称,即对应文件名。

path

string

表示当前页面的路径。

- 示例 ``` var page = router.getState(); console.log('current index = ' + page.index); console.log('current name = ' + page.name); console.log('current path = ' + page.path); ```