1# @ohos.router (Page Routing) (Not Recommended) 2 3The **Router** module provides APIs to access pages through URLs. You can use the APIs to navigate to a specified page in an application, replace the current page with another one in the same application, and return to the previous page or a specified page. 4 5For routing management, it is recommended that you use the [Navigation](../../ui/arkts-navigation-navigation.md) component instead as your application routing framework. 6 7> **NOTE** 8> 9> - The initial APIs of this module are supported since API version 8. Newly added APIs will be marked with a superscript to indicate their earliest API version. 10> 11> - Page routing APIs can be invoked only after page rendering is complete. Do not call these APIs in **onInit** and **onReady** when the page is still in the rendering phase. 12> 13> - The functionality of this module depends on UI context. This means that the APIs of this module cannot be used where [the UI context is unclear](../../ui/arkts-global-interface.md). For details, see [UIContext](./js-apis-arkui-UIContext.md#uicontext). 14> 15> - When using [pushUrl](js-apis-arkui-UIContext.md#pushurl-1) or [pushNamedRoute](js-apis-arkui-UIContext.md#pushnamedroute-1) with a callback to return the result, be aware that the stack information obtained through the callback using APIs such as [getLength](js-apis-arkui-UIContext.md#getlength) represents an intermediate state during the navigation operation. This temporary state might differ from the final stack information available after the stack operation is complete. 16 17## Modules to Import 18 19``` 20import { router } from '@kit.ArkUI'; 21``` 22 23## router.pushUrl<sup>(deprecated)</sup> 24 25pushUrl(options: RouterOptions): Promise<void> 26 27Navigates to a specified page in the application. 28 29> **NOTE** 30> 31> This API is supported since API version 9 and deprecated since API version 18. You are advised to use [pushUrl](js-apis-arkui-UIContext.md#pushurl) instead on the obtained [Router](js-apis-arkui-UIContext.md#router) object. 32> 33> Since API version 10, you can use the [getRouter](js-apis-arkui-UIContext.md#getrouter) API in [UIContext](js-apis-arkui-UIContext.md#uicontext) to obtain the [Router](js-apis-arkui-UIContext.md#router) object associated with the current UI context. 34 35**Atomic service API**: This API can be used in atomic services since API version 11. 36 37**System capability**: SystemCapability.ArkUI.ArkUI.Full 38 39**Parameters** 40 41| Name | Type | Mandatory | Description | 42| ------- | ------------------------------- | ---- | --------- | 43| options | [RouterOptions](#routeroptions) | Yes | Page routing parameters.| 44 45**Return value** 46 47| Type | Description | 48| ------------------- | --------- | 49| Promise<void> | Promise used to return the result.| 50 51**Error codes** 52 53For details about the error codes, see [Universal Error Codes](../errorcode-universal.md) and [Router Error Codes](errorcode-router.md). 54> **NOTE** 55> 56> The following error codes returned by this API are all of the string type. 57 58| ID | Error Message| 59| --------- | ------- | 60| 401 | Parameter error. Possible causes: 1. Mandatory parameters are left unspecified; 2.Incorrect parameters types; 3. Parameter verification failed. | 61| 100001 | Internal error. | 62| 100002 | Uri error. The URI of the page to redirect is incorrect or does not exist. | 63| 100003 | Page stack error. Too many pages are pushed. | 64 65**Example** 66 67```ts 68import { BusinessError } from '@kit.BasicServicesKit'; 69 70class innerParams { 71 data3: number[]; 72 73 constructor(tuple: number[]) { 74 this.data3 = tuple; 75 } 76} 77 78class routerParams { 79 data1: string; 80 data2: innerParams; 81 82 constructor(str: string, tuple: number[]) { 83 this.data1 = str; 84 this.data2 = new innerParams(tuple); 85 } 86} 87 88router.pushUrl({ 89 url: 'pages/routerpage2', 90 params: new routerParams('message', [123, 456, 789]) 91}) 92 .then(() => { 93 console.error(`pushUrl finish`); 94 }) 95 .catch((err: ESObject) => { 96 console.error(`pushUrl failed, code is ${(err as BusinessError).code}, message is ${(err as BusinessError).message}`); 97 }) 98``` 99 100## router.pushUrl<sup>(deprecated)</sup> 101 102pushUrl(options: RouterOptions, callback: AsyncCallback<void>): void 103 104Navigates to a specified page in the application. 105 106> **NOTE** 107> 108> This API is supported since API version 9 and deprecated since API version 18. You are advised to use [[pushUrl](js-apis-arkui-UIContext.md#pushurl-1) instead on the obtained [Router](js-apis-arkui-UIContext.md#router) object. 109> 110> Since API version 10, you can use the [getRouter](js-apis-arkui-UIContext.md#getrouter) API in [UIContext](js-apis-arkui-UIContext.md#uicontext) to obtain the [Router](js-apis-arkui-UIContext.md#router) object associated with the current UI context. 111 112**Atomic service API**: This API can be used in atomic services since API version 11. 113 114**System capability**: SystemCapability.ArkUI.ArkUI.Full 115 116**Parameters** 117 118| Name | Type | Mandatory | Description | 119| ------- | ------------------------------- | ---- | --------- | 120| options | [RouterOptions](#routeroptions) | Yes | Page routing parameters.| 121| callback | AsyncCallback<void> | Yes | Callback used to return the result. | 122 123**Error codes** 124 125For details about the error codes, see [Universal Error Codes](../errorcode-universal.md) and [Router Error Codes](errorcode-router.md). 126> **NOTE** 127> 128> The following error codes returned by this API are all of the string type. 129 130| ID | Error Message| 131| --------- | ------- | 132| 401 | Parameter error. Possible causes: 1. Mandatory parameters are left unspecified; 2.Incorrect parameters types; 3. Parameter verification failed. | 133| 100001 | Internal error. | 134| 100002 | Uri error. The URI of the page to redirect is incorrect or does not exist. | 135| 100003 | Page stack error. Too many pages are pushed. | 136 137**Example** 138 139```ts 140class innerParams { 141 data3: number[]; 142 143 constructor(tuple: number[]) { 144 this.data3 = tuple; 145 } 146} 147 148class routerParams { 149 data1: string; 150 data2: innerParams; 151 152 constructor(str: string, tuple: number[]) { 153 this.data1 = str; 154 this.data2 = new innerParams(tuple); 155 } 156} 157 158router.pushUrl({ 159 url: 'pages/routerpage2', 160 params: new routerParams('message', [123, 456, 789]) 161}, (err) => { 162 if (err) { 163 console.error(`pushUrl failed, code is ${err.code}, message is ${err.message}`); 164 return; 165 } 166 console.info('pushUrl success'); 167}) 168``` 169## router.pushUrl<sup>(deprecated)</sup> 170 171pushUrl(options: RouterOptions, mode: RouterMode): Promise<void> 172 173Navigates to a specified page in the application. 174 175> **NOTE** 176> 177> This API is supported since API version 9 and deprecated since API version 18. You are advised to use [[pushUrl](js-apis-arkui-UIContext.md#pushurl-2) instead on the obtained [Router](js-apis-arkui-UIContext.md#router) object. 178> 179> Since API version 10, you can use the [getRouter](js-apis-arkui-UIContext.md#getrouter) API in [UIContext](js-apis-arkui-UIContext.md#uicontext) to obtain the [Router](js-apis-arkui-UIContext.md#router) object associated with the current UI context. 180 181**Atomic service API**: This API can be used in atomic services since API version 11. 182 183**System capability**: SystemCapability.ArkUI.ArkUI.Full 184 185**Parameters** 186 187| Name | Type | Mandatory | Description | 188| ------- | ------------------------------- | ---- | ---------- | 189| options | [RouterOptions](#routeroptions) | Yes | Page routing parameters. | 190| mode | [RouterMode](#routermode9) | Yes | Routing mode.| 191 192**Return value** 193 194| Type | Description | 195| ------------------- | --------- | 196| Promise<void> | Promise used to return the result.| 197 198**Error codes** 199 200For details about the error codes, see [Universal Error Codes](../errorcode-universal.md) and [Router Error Codes](errorcode-router.md). 201> **NOTE** 202> 203> The following error codes returned by this API are all of the string type. 204 205| ID | Error Message| 206| --------- | ------- | 207| 401 | Parameter error. Possible causes: 1. Mandatory parameters are left unspecified; 2.Incorrect parameters types; 3. Parameter verification failed. | 208| 100001 | Internal error. | 209| 100002 | Uri error. The URI of the page to redirect is incorrect or does not exist. | 210| 100003 | Page stack error. Too many pages are pushed. | 211 212**Example** 213 214```ts 215import { BusinessError } from '@kit.BasicServicesKit'; 216 217class innerParams { 218 data3: number[]; 219 220 constructor(tuple: number[]) { 221 this.data3 = tuple; 222 } 223} 224 225class routerParams { 226 data1: string; 227 data2: innerParams; 228 229 constructor(str: string, tuple: number[]) { 230 this.data1 = str; 231 this.data2 = new innerParams(tuple); 232 } 233} 234 235router.pushUrl({ 236 url: 'pages/routerpage2', 237 params: new routerParams('message', [123, 456, 789]) 238}, router.RouterMode.Standard) 239 .then(() => { 240 console.error(`pushUrl finish`); 241 }) 242 .catch((err: ESObject) => { 243 console.error(`pushUrl failed, code is ${(err as BusinessError).code}, message is ${(err as BusinessError).message}`); 244 }) 245``` 246 247## router.pushUrl<sup>(deprecated)</sup> 248 249pushUrl(options: RouterOptions, mode: RouterMode, callback: AsyncCallback<void>): void 250 251Navigates to a specified page in the application. 252 253> **NOTE** 254> 255> This API is supported since API version 9 and deprecated since API version 18. You are advised to use [[pushUrl](js-apis-arkui-UIContext.md#pushurl-3) instead on the obtained [Router](js-apis-arkui-UIContext.md#router) object. 256> 257> Since API version 10, you can use the [getRouter](js-apis-arkui-UIContext.md#getrouter) API in [UIContext](js-apis-arkui-UIContext.md#uicontext) to obtain the [Router](js-apis-arkui-UIContext.md#router) object associated with the current UI context. 258 259**Atomic service API**: This API can be used in atomic services since API version 11. 260 261**System capability**: SystemCapability.ArkUI.ArkUI.Full 262 263**Parameters** 264 265| Name | Type | Mandatory | Description | 266| ------- | ------------------------------- | ---- | ---------- | 267| options | [RouterOptions](#routeroptions) | Yes | Page routing parameters. | 268| mode | [RouterMode](#routermode9) | Yes | Routing mode.| 269| callback | AsyncCallback<void> | Yes | Callback used to return the result. | 270 271**Error codes** 272 273For details about the error codes, see [Universal Error Codes](../errorcode-universal.md) and [Router Error Codes](errorcode-router.md). 274> **NOTE** 275> 276> The following error codes returned by this API are all of the string type. 277 278| ID | Error Message| 279| --------- | ------- | 280| 401 | Parameter error. Possible causes: 1. Mandatory parameters are left unspecified; 2.Incorrect parameters types; 3. Parameter verification failed. | 281| 100001 | Internal error. | 282| 100002 | Uri error. The URI of the page to redirect is incorrect or does not exist. | 283| 100003 | Page stack error. Too many pages are pushed. | 284 285**Example** 286 287```ts 288class innerParams { 289 data3: number[]; 290 291 constructor(tuple: number[]) { 292 this.data3 = tuple; 293 } 294} 295 296class routerParams { 297 data1: string; 298 data2: innerParams; 299 300 constructor(str: string, tuple: number[]) { 301 this.data1 = str; 302 this.data2 = new innerParams(tuple); 303 } 304} 305 306router.pushUrl({ 307 url: 'pages/routerpage2', 308 params: new routerParams('message', [123, 456, 789]) 309}, router.RouterMode.Standard, (err) => { 310 if (err) { 311 console.error(`pushUrl failed, code is ${err.code}, message is ${err.message}`); 312 return; 313 } 314 console.info('pushUrl success'); 315}) 316``` 317 318## router.replaceUrl<sup>(deprecated)</sup> 319 320replaceUrl(options: RouterOptions): Promise<void> 321 322Replaces the current page with another one in the application and destroys the current page. This API cannot be used to configure page transition effects. To configure page transition effects, use the [Navigation](../../ui/arkts-navigation-navigation.md) component. 323 324> **NOTE** 325> 326> This API is supported since API version 9 and deprecated since API version 18. You are advised to use [replaceUrl](js-apis-arkui-UIContext.md#replaceurl) instead on the obtained [Router](js-apis-arkui-UIContext.md#router) object. 327> 328> Since API version 10, you can use the [getRouter](js-apis-arkui-UIContext.md#getrouter) API in [UIContext](js-apis-arkui-UIContext.md#uicontext) to obtain the [Router](js-apis-arkui-UIContext.md#router) object associated with the current UI context. 329 330**Atomic service API**: This API can be used in atomic services since API version 11. 331 332**System capability**: SystemCapability.ArkUI.ArkUI.Lite 333 334**Parameters** 335 336| Name | Type | Mandatory| Description | 337| ------- | ------------------------------- | ---- | ------------------ | 338| options | [RouterOptions](#routeroptions) | Yes | Description of the new page.| 339 340**Return value** 341 342| Type | Description | 343| ------------------- | --------- | 344| Promise<void> | Promise used to return the result.| 345 346**Error codes** 347 348For details about the error codes, see [Universal Error Codes](../errorcode-universal.md) and [Router Error Codes](errorcode-router.md). 349> **NOTE** 350> 351> The following error codes returned by this API are all of the string type. 352 353| ID | Error Message| 354| --------- | ------- | 355| 401 | Parameter error. Possible causes: 1. Mandatory parameters are left unspecified; 2.Incorrect parameters types; 3. Parameter verification failed. | 356| 100001 | The UI execution context is not found. This error code is thrown only in the standard system. | 357| 200002 | Uri error. The URI of the page to be used for replacement is incorrect or does not exist. | 358 359**Example** 360 361```ts 362import { BusinessError } from '@kit.BasicServicesKit'; 363 364class routerParams { 365 data1: string; 366 367 constructor(str: string) { 368 this.data1 = str; 369 } 370} 371 372router.replaceUrl({ 373 url: 'pages/detail', 374 params: new routerParams('message') 375}) 376 .then(() => { 377 console.error(`replaceUrl finish`); 378 }) 379 .catch((err: ESObject) => { 380 console.error(`replaceUrl failed, code is ${(err as BusinessError).code}, message is ${(err as BusinessError).message}`); 381 }) 382``` 383 384## router.replaceUrl<sup>(deprecated)</sup> 385 386replaceUrl(options: RouterOptions, callback: AsyncCallback<void>): void 387 388Replaces the current page with another one in the application and destroys the current page. 389 390> **NOTE** 391> 392> This API is supported since API version 9 and deprecated since API version 18. You are advised to use [replaceUrl](js-apis-arkui-UIContext.md#replaceurl-1) instead on the obtained [Router](js-apis-arkui-UIContext.md#router) object. 393> 394> Since API version 10, you can use the [getRouter](js-apis-arkui-UIContext.md#getrouter) API in [UIContext](js-apis-arkui-UIContext.md#uicontext) to obtain the [Router](js-apis-arkui-UIContext.md#router) object associated with the current UI context. 395 396**Atomic service API**: This API can be used in atomic services since API version 11. 397 398**System capability**: SystemCapability.ArkUI.ArkUI.Lite 399 400**Parameters** 401 402| Name | Type | Mandatory| Description | 403| ------- | ------------------------------- | ---- | ------------------ | 404| options | [RouterOptions](#routeroptions) | Yes | Description of the new page.| 405| callback | AsyncCallback<void> | Yes | Callback used to return the result. | 406 407**Error codes** 408 409For details about the error codes, see [Universal Error Codes](../errorcode-universal.md) and [Router Error Codes](errorcode-router.md). 410> **NOTE** 411> 412> The following error codes returned by this API are all of the string type. 413 414| ID | Error Message| 415| --------- | ------- | 416| 401 | Parameter error. Possible causes: 1. Mandatory parameters are left unspecified; 2.Incorrect parameters types; 3. Parameter verification failed. | 417| 100001 | The UI execution context is not found. This error code is thrown only in the standard system. | 418| 200002 | Uri error. The URI of the page to be used for replacement is incorrect or does not exist. | 419 420**Example** 421 422```ts 423class routerParams { 424 data1: string; 425 426 constructor(str: string) { 427 this.data1 = str; 428 } 429} 430 431router.replaceUrl({ 432 url: 'pages/detail', 433 params: new routerParams('message') 434}, (err) => { 435 if (err) { 436 console.error(`replaceUrl failed, code is ${err.code}, message is ${err.message}`); 437 return; 438 } 439 console.info('replaceUrl success'); 440}) 441``` 442 443## router.replaceUrl<sup>(deprecated)</sup> 444 445replaceUrl(options: RouterOptions, mode: RouterMode): Promise<void> 446 447Replaces the current page with another one in the application and destroys the current page. 448 449> **NOTE** 450> 451> This API is supported since API version 9 and deprecated since API version 18. You are advised to use [replaceUrl](js-apis-arkui-UIContext.md#replaceurl-2) instead on the obtained [Router](js-apis-arkui-UIContext.md#router) object. 452> 453> Since API version 10, you can use the [getRouter](js-apis-arkui-UIContext.md#getrouter) API in [UIContext](js-apis-arkui-UIContext.md#uicontext) to obtain the [Router](js-apis-arkui-UIContext.md#router) object associated with the current UI context. 454 455**Atomic service API**: This API can be used in atomic services since API version 11. 456 457**System capability**: SystemCapability.ArkUI.ArkUI.Lite 458 459**Parameters** 460 461| Name | Type | Mandatory | Description | 462| ------- | ------------------------------- | ---- | ---------- | 463| options | [RouterOptions](#routeroptions) | Yes | Description of the new page. | 464| mode | [RouterMode](#routermode9) | Yes | Routing mode.| 465 466 467**Return value** 468 469| Type | Description | 470| ------------------- | --------- | 471| Promise<void> | Promise used to return the result.| 472 473**Error codes** 474 475For details about the error codes, see [Universal Error Codes](../errorcode-universal.md) and [Router Error Codes](errorcode-router.md). 476> **NOTE** 477> 478> The following error codes returned by this API are all of the string type. 479 480| ID | Error Message| 481| --------- | ------- | 482| 401 | Parameter error. Possible causes: 1. Mandatory parameters are left unspecified; 2.Incorrect parameters types; 3. Parameter verification failed. | 483| 100001 | Failed to get the delegate. This error code is thrown only in the standard system. | 484| 200002 | Uri error. The URI of the page to be used for replacement is incorrect or does not exist. | 485 486**Example** 487 488```ts 489import { BusinessError } from '@kit.BasicServicesKit'; 490 491class routerParams { 492 data1:string; 493 494 constructor(str:string) { 495 this.data1 = str; 496 } 497} 498 499router.replaceUrl({ 500 url: 'pages/detail', 501 params: new routerParams('message') 502}, router.RouterMode.Standard) 503 .then(() => { 504 console.error(`replaceUrl finish`); 505 }) 506 .catch((err: ESObject) => { 507 console.error(`replaceUrl failed, code is ${(err as BusinessError).code}, message is ${(err as BusinessError).message}`); 508 }) 509``` 510 511## router.replaceUrl<sup>(deprecated)</sup> 512 513replaceUrl(options: RouterOptions, mode: RouterMode, callback: AsyncCallback<void>): void 514 515Replaces the current page with another one in the application and destroys the current page. 516 517> **NOTE** 518> 519> This API is supported since API version 9 and deprecated since API version 18. You are advised to use [replaceUrl](js-apis-arkui-UIContext.md#replaceurl-3) instead on the obtained [Router](js-apis-arkui-UIContext.md#router) object. 520> 521> Since API version 10, you can use the [getRouter](js-apis-arkui-UIContext.md#getrouter) API in [UIContext](js-apis-arkui-UIContext.md#uicontext) to obtain the [Router](js-apis-arkui-UIContext.md#router) object associated with the current UI context. 522 523**Atomic service API**: This API can be used in atomic services since API version 11. 524 525**System capability**: SystemCapability.ArkUI.ArkUI.Lite 526 527**Parameters** 528 529| Name | Type | Mandatory | Description | 530| ------- | ------------------------------- | ---- | ---------- | 531| options | [RouterOptions](#routeroptions) | Yes | Description of the new page. | 532| mode | [RouterMode](#routermode9) | Yes | Routing mode.| 533| callback | AsyncCallback<void> | Yes | Callback used to return the result. | 534 535**Error codes** 536 537For details about the error codes, see [Universal Error Codes](../errorcode-universal.md) and [Router Error Codes](errorcode-router.md). 538> **NOTE** 539> 540> The following error codes returned by this API are all of the string type. 541 542| ID | Error Message| 543| --------- | ------- | 544| 401 | Parameter error. Possible causes: 1. Mandatory parameters are left unspecified; 2.Incorrect parameters types; 3. Parameter verification failed. | 545| 100001 | The UI execution context is not found. This error code is thrown only in the standard system. | 546| 200002 | Uri error. The URI of the page to be used for replacement is incorrect or does not exist. | 547 548**Example** 549 550```ts 551class routerParams { 552 data1: string; 553 554 constructor(str: string) { 555 this.data1 = str; 556 } 557} 558 559router.replaceUrl({ 560 url: 'pages/detail', 561 params: new routerParams('message') 562}, router.RouterMode.Standard, (err) => { 563 if (err) { 564 console.error(`replaceUrl failed, code is ${err.code}, message is ${err.message}`); 565 return; 566 } 567 console.info('replaceUrl success'); 568}); 569``` 570 571## router.pushNamedRoute<sup>(deprecated)</sup> 572 573pushNamedRoute(options: NamedRouterOptions): Promise<void> 574 575Navigates to a page using the named route. This API uses a promise to return the result. 576 577> **NOTE** 578> 579> This API is supported since API version 10 and deprecated since API version 18. You are advised to use [pushNamedRoute](js-apis-arkui-UIContext.md#pushnamedroute) instead on the obtained [Router](js-apis-arkui-UIContext.md#router) object. 580> 581> Since API version 10, you can use the [getRouter](js-apis-arkui-UIContext.md#getrouter) API in [UIContext](js-apis-arkui-UIContext.md#uicontext) to obtain the [Router](js-apis-arkui-UIContext.md#router) object associated with the current UI context. 582 583**Atomic service API**: This API can be used in atomic services since API version 11. 584 585**System capability**: SystemCapability.ArkUI.ArkUI.Full 586 587**Parameters** 588 589| Name | Type | Mandatory | Description | 590| ------- | ------------------------------- | ---- | --------- | 591| options | [NamedRouterOptions](#namedrouteroptions10) | Yes | Page routing parameters.| 592 593**Return value** 594 595| Type | Description | 596| ------------------- | --------- | 597| Promise<void> | Promise used to return the result.| 598 599**Error codes** 600 601For details about the error codes, see [Universal Error Codes](../errorcode-universal.md) and [Router Error Codes](errorcode-router.md). 602> **NOTE** 603> 604> The following error codes returned by this API are all of the string type. 605 606| ID | Error Message| 607| --------- | ------- | 608| 401 | Parameter error. Possible causes: 1. Mandatory parameters are left unspecified; 2.Incorrect parameters types; 3. Parameter verification failed. | 609| 100001 | Internal error. | 610| 100003 | Page stack error. Too many pages are pushed. | 611| 100004 | Named route error. The named route does not exist. | 612 613**Example** 614 615```ts 616import { BusinessError } from '@kit.BasicServicesKit'; 617 618class innerParams { 619 data3: number[]; 620 621 constructor(tuple: number[]) { 622 this.data3 = tuple; 623 } 624} 625 626class routerParams { 627 data1: string; 628 data2: innerParams; 629 630 constructor(str: string, tuple: number[]) { 631 this.data1 = str; 632 this.data2 = new innerParams(tuple); 633 } 634} 635 636router.pushNamedRoute({ 637 name: 'myPage', 638 params: new routerParams('message', [123, 456, 789]) 639}) 640 .then(() => { 641 console.error(`pushNamedRoute finish`); 642 }) 643 .catch((err: ESObject) => { 644 console.error(`pushNamedRoute failed, code is ${(err as BusinessError).code}, message is ${(err as BusinessError).message}`); 645 }) 646``` 647 648For details, see [UI Development-Named Route](../../ui/arkts-routing.md#named-route). 649 650## router.pushNamedRoute<sup>(deprecated)</sup> 651 652pushNamedRoute(options: NamedRouterOptions, callback: AsyncCallback<void>): void 653 654Navigates to a page using the named route. This API uses a promise to return the result. 655 656> **NOTE** 657> 658> This API is supported since API version 10 and deprecated since API version 18. You are advised to use [pushNamedRoute](js-apis-arkui-UIContext.md#pushnamedroute-1) instead on the obtained [Router](js-apis-arkui-UIContext.md#router) object. 659> 660> Since API version 10, you can use the [getRouter](js-apis-arkui-UIContext.md#getrouter) API in [UIContext](js-apis-arkui-UIContext.md#uicontext) to obtain the [Router](js-apis-arkui-UIContext.md#router) object associated with the current UI context. 661 662**Atomic service API**: This API can be used in atomic services since API version 11. 663 664**System capability**: SystemCapability.ArkUI.ArkUI.Full 665 666**Parameters** 667 668| Name | Type | Mandatory | Description | 669| ------- | ------------------------------- | ---- | --------- | 670| options | [NamedRouterOptions](#namedrouteroptions10) | Yes | Page routing parameters.| 671| callback | AsyncCallback<void> | Yes | Callback used to return the result. | 672 673**Error codes** 674 675For details about the error codes, see [Universal Error Codes](../errorcode-universal.md) and [Router Error Codes](errorcode-router.md). 676> **NOTE** 677> 678> The following error codes returned by this API are all of the string type. 679 680| ID | Error Message| 681| --------- | ------- | 682| 401 | Parameter error. Possible causes: 1. Mandatory parameters are left unspecified; 2.Incorrect parameters types; 3. Parameter verification failed. | 683| 100001 | Internal error. | 684| 100003 | Page stack error. Too many pages are pushed. | 685| 100004 | Named route error. The named route does not exist. | 686 687**Example** 688 689```ts 690class innerParams { 691 data3: number[]; 692 693 constructor(tuple: number[]) { 694 this.data3 = tuple; 695 } 696} 697 698class routerParams { 699 data1: string; 700 data2: innerParams; 701 702 constructor(str: string, tuple: number[]) { 703 this.data1 = str; 704 this.data2 = new innerParams(tuple); 705 } 706} 707 708router.pushNamedRoute({ 709 name: 'myPage', 710 params: new routerParams('message', [123, 456, 789]) 711}, (err) => { 712 if (err) { 713 console.error(`pushNamedRoute failed, code is ${err.code}, message is ${err.message}`); 714 return; 715 } 716 console.info('pushNamedRoute success'); 717}) 718``` 719## router.pushNamedRoute<sup>(deprecated)</sup> 720 721pushNamedRoute(options: NamedRouterOptions, mode: RouterMode): Promise<void> 722 723Navigates to a page using the named route. This API uses a promise to return the result. 724 725> **NOTE** 726> 727> This API is supported since API version 10 and deprecated since API version 18. You are advised to use [pushNamedRoute](js-apis-arkui-UIContext.md#pushnamedroute-2) instead on the obtained [Router](js-apis-arkui-UIContext.md#router) object. 728> 729> Since API version 10, you can use the [getRouter](js-apis-arkui-UIContext.md#getrouter) API in [UIContext](js-apis-arkui-UIContext.md#uicontext) to obtain the [Router](js-apis-arkui-UIContext.md#router) object associated with the current UI context. 730 731**Atomic service API**: This API can be used in atomic services since API version 11. 732 733**System capability**: SystemCapability.ArkUI.ArkUI.Full 734 735**Parameters** 736 737| Name | Type | Mandatory | Description | 738| ------- | ------------------------------- | ---- | ---------- | 739| options | [NamedRouterOptions](#namedrouteroptions10) | Yes | Page routing parameters. | 740| mode | [RouterMode](#routermode9) | Yes | Routing mode.| 741 742**Return value** 743 744| Type | Description | 745| ------------------- | --------- | 746| Promise<void> | Promise used to return the result.| 747 748**Error codes** 749 750For details about the error codes, see [Universal Error Codes](../errorcode-universal.md) and [Router Error Codes](errorcode-router.md). 751> **NOTE** 752> 753> The following error codes returned by this API are all of the string type. 754 755| ID | Error Message| 756| --------- | ------- | 757| 401 | Parameter error. Possible causes: 1. Mandatory parameters are left unspecified; 2.Incorrect parameters types; 3. Parameter verification failed. | 758| 100001 | Internal error. | 759| 100003 | Page stack error. Too many pages are pushed. | 760| 100004 | Named route error. The named route does not exist. | 761 762**Example** 763 764```ts 765import { BusinessError } from '@kit.BasicServicesKit'; 766 767class innerParams { 768 data3: number[]; 769 770 constructor(tuple: number[]) { 771 this.data3 = tuple; 772 } 773} 774 775class routerParams { 776 data1: string; 777 data2: innerParams; 778 779 constructor(str: string, tuple: number[]) { 780 this.data1 = str 781 this.data2 = new innerParams(tuple) 782 } 783} 784 785router.pushNamedRoute({ 786 name: 'myPage', 787 params: new routerParams('message', [123, 456, 789]) 788}, router.RouterMode.Standard) 789 .then(() => { 790 console.error(`pushNamedRoute finish`); 791 }) 792 .catch((err: ESObject) => { 793 console.error(`pushNamedRoute failed, code is ${(err as BusinessError).code}, message is ${(err as BusinessError).message}`); 794 }) 795``` 796 797## router.pushNamedRoute<sup>(deprecated)</sup> 798 799pushNamedRoute(options: NamedRouterOptions, mode: RouterMode, callback: AsyncCallback<void>): void 800 801Navigates to a page using the named route. This API uses a promise to return the result. 802 803> **NOTE** 804> 805> This API is supported since API version 10 and deprecated since API version 18. You are advised to use [pushNamedRoute](js-apis-arkui-UIContext.md#pushnamedroute-3) instead on the obtained [Router](js-apis-arkui-UIContext.md#router) object. 806> 807> Since API version 10, you can use the [getRouter](js-apis-arkui-UIContext.md#getrouter) API in [UIContext](js-apis-arkui-UIContext.md#uicontext) to obtain the [Router](js-apis-arkui-UIContext.md#router) object associated with the current UI context. 808 809**Atomic service API**: This API can be used in atomic services since API version 11. 810 811**System capability**: SystemCapability.ArkUI.ArkUI.Full 812 813**Parameters** 814 815| Name | Type | Mandatory | Description | 816| ------- | ------------------------------- | ---- | ---------- | 817| options | [NamedRouterOptions](#namedrouteroptions10) | Yes | Page routing parameters. | 818| mode | [RouterMode](#routermode9) | Yes | Routing mode.| 819| callback | AsyncCallback<void> | Yes | Callback used to return the result. | 820 821**Error codes** 822 823For details about the error codes, see [Universal Error Codes](../errorcode-universal.md) and [Router Error Codes](errorcode-router.md). 824> **NOTE** 825> 826> The following error codes returned by this API are all of the string type. 827 828| ID | Error Message| 829| --------- | ------- | 830| 401 | Parameter error. Possible causes: 1. Mandatory parameters are left unspecified; 2.Incorrect parameters types; 3. Parameter verification failed. | 831| 100001 | Internal error. | 832| 100003 | Page stack error. Too many pages are pushed. | 833| 100004 | Named route error. The named route does not exist. | 834 835**Example** 836 837```ts 838class innerParams { 839 data3: number[]; 840 841 constructor(tuple: number[]) { 842 this.data3 = tuple; 843 } 844} 845 846class routerParams { 847 data1: string; 848 data2: innerParams; 849 850 constructor(str: string, tuple: number[]) { 851 this.data1 = str; 852 this.data2 = new innerParams(tuple); 853 } 854} 855 856router.pushNamedRoute({ 857 name: 'myPage', 858 params: new routerParams('message', [123, 456, 789]) 859}, router.RouterMode.Standard, (err) => { 860 if (err) { 861 console.error(`pushNamedRoute failed, code is ${err.code}, message is ${err.message}`); 862 return; 863 } 864 console.info('pushNamedRoute success'); 865}) 866``` 867 868## router.replaceNamedRoute<sup>(deprecated)</sup> 869 870replaceNamedRoute(options: NamedRouterOptions): Promise<void> 871 872Replaces the current page with another one using the named route and destroys the current page. This API uses a promise to return the result. 873 874> **NOTE** 875> 876> This API is supported since API version 10 and deprecated since API version 18. You are advised to use [replaceNamedRoute](js-apis-arkui-UIContext.md#replacenamedroute) instead on the obtained [Router](js-apis-arkui-UIContext.md#router) object. 877> 878> Since API version 10, you can use the [getRouter](js-apis-arkui-UIContext.md#getrouter) API in [UIContext](js-apis-arkui-UIContext.md#uicontext) to obtain the [Router](js-apis-arkui-UIContext.md#router) object associated with the current UI context. 879 880**Atomic service API**: This API can be used in atomic services since API version 11. 881 882**System capability**: SystemCapability.ArkUI.ArkUI.Full 883 884**Parameters** 885 886| Name | Type | Mandatory| Description | 887| ------- | ------------------------------- | ---- | ------------------ | 888| options | [NamedRouterOptions](#namedrouteroptions10) | Yes | Description of the new page.| 889 890**Return value** 891 892| Type | Description | 893| ------------------- | --------- | 894| Promise<void> | Promise used to return the result.| 895 896**Error codes** 897 898For details about the error codes, see [Universal Error Codes](../errorcode-universal.md) and [Router Error Codes](errorcode-router.md). 899> **NOTE** 900> 901> The following error codes returned by this API are all of the string type. 902 903| ID | Error Message| 904| --------- | ------- | 905| 401 | Parameter error. Possible causes: 1. Mandatory parameters are left unspecified; 2.Incorrect parameters types; 3. Parameter verification failed. | 906| 100001 | The UI execution context is not found. This error code is thrown only in the standard system. | 907| 100004 | Named route error. The named route does not exist. | 908 909**Example** 910 911```ts 912import { BusinessError } from '@kit.BasicServicesKit'; 913 914class routerParams { 915 data1: string; 916 917 constructor(str: string) { 918 this.data1 = str; 919 } 920} 921 922router.replaceNamedRoute({ 923 name: 'myPage', 924 params: new routerParams('message') 925}) 926 .then(() => { 927 console.error(`replaceNamedRoute finish`); 928 }) 929 .catch((err: ESObject) => { 930 console.error(`replaceNamedRoute failed, code is ${(err as BusinessError).code}, message is ${(err as BusinessError).message}`); 931 }) 932``` 933 934## router.replaceNamedRoute<sup>(deprecated)</sup> 935 936replaceNamedRoute(options: NamedRouterOptions, callback: AsyncCallback<void>): void 937 938Replaces the current page with another one using the named route and destroys the current page. This API uses a promise to return the result. 939 940> **NOTE** 941> 942> This API is supported since API version 10 and deprecated since API version 18. You are advised to use [replaceNamedRoute](js-apis-arkui-UIContext.md#replacenamedroute-1) instead on the obtained [Router](js-apis-arkui-UIContext.md#router) object. 943> 944> Since API version 10, you can use the [getRouter](js-apis-arkui-UIContext.md#getrouter) API in [UIContext](js-apis-arkui-UIContext.md#uicontext) to obtain the [Router](js-apis-arkui-UIContext.md#router) object associated with the current UI context. 945 946**Atomic service API**: This API can be used in atomic services since API version 11. 947 948**System capability**: SystemCapability.ArkUI.ArkUI.Full 949 950**Parameters** 951 952| Name | Type | Mandatory| Description | 953| ------- | ------------------------------- | ---- | ------------------ | 954| options | [NamedRouterOptions](#namedrouteroptions10) | Yes | Description of the new page.| 955| callback | AsyncCallback<void> | Yes | Callback used to return the result. | 956 957**Error codes** 958 959For details about the error codes, see [Universal Error Codes](../errorcode-universal.md) and [Router Error Codes](errorcode-router.md). 960> **NOTE** 961> 962> The following error codes returned by this API are all of the string type. 963 964| ID | Error Message| 965| --------- | ------- | 966| 401 | Parameter error. Possible causes: 1. Mandatory parameters are left unspecified; 2.Incorrect parameters types; 3. Parameter verification failed. | 967| 100001 | The UI execution context is not found. This error code is thrown only in the standard system. | 968| 100004 | Named route error. The named route does not exist. | 969 970**Example** 971 972```ts 973class routerParams { 974 data1: string; 975 976 constructor(str: string) { 977 this.data1 = str; 978 } 979} 980 981router.replaceNamedRoute({ 982 name: 'myPage', 983 params: new routerParams('message') 984}, (err) => { 985 if (err) { 986 console.error(`replaceNamedRoute failed, code is ${err.code}, message is ${err.message}`); 987 return; 988 } 989 console.info('replaceNamedRoute success'); 990}) 991``` 992 993## router.replaceNamedRoute<sup>(deprecated)</sup> 994 995replaceNamedRoute(options: NamedRouterOptions, mode: RouterMode): Promise<void> 996 997Replaces the current page with another one using the named route and destroys the current page. This API uses a promise to return the result. 998 999> **NOTE** 1000> 1001> This API is supported since API version 10 and deprecated since API version 18. You are advised to use [replaceNamedRoute](js-apis-arkui-UIContext.md#replacenamedroute-2) instead on the obtained [Router](js-apis-arkui-UIContext.md#router) object. 1002> 1003> Since API version 10, you can use the [getRouter](js-apis-arkui-UIContext.md#getrouter) API in [UIContext](js-apis-arkui-UIContext.md#uicontext) to obtain the [Router](js-apis-arkui-UIContext.md#router) object associated with the current UI context. 1004 1005**Atomic service API**: This API can be used in atomic services since API version 11. 1006 1007**System capability**: SystemCapability.ArkUI.ArkUI.Full 1008 1009**Parameters** 1010 1011| Name | Type | Mandatory | Description | 1012| ------- | ------------------------------- | ---- | ---------- | 1013| options | [NamedRouterOptions](#namedrouteroptions10) | Yes | Description of the new page. | 1014| mode | [RouterMode](#routermode9) | Yes | Routing mode.| 1015 1016 1017**Return value** 1018 1019| Type | Description | 1020| ------------------- | --------- | 1021| Promise<void> | Promise used to return the result.| 1022 1023**Error codes** 1024 1025For details about the error codes, see [Universal Error Codes](../errorcode-universal.md) and [Router Error Codes](errorcode-router.md). 1026> **NOTE** 1027> 1028> The following error codes returned by this API are all of the string type. 1029 1030| ID | Error Message| 1031| --------- | ------- | 1032| 401 | Parameter error. Possible causes: 1. Mandatory parameters are left unspecified; 2.Incorrect parameters types; 3. Parameter verification failed. | 1033| 100001 | Failed to get the delegate. This error code is thrown only in the standard system. | 1034| 100004 | Named route error. The named route does not exist. | 1035 1036**Example** 1037 1038```ts 1039import { BusinessError } from '@kit.BasicServicesKit'; 1040 1041class routerParams { 1042 data1: string; 1043 1044 constructor(str: string) { 1045 this.data1 = str; 1046 } 1047} 1048 1049router.replaceNamedRoute({ 1050 name: 'myPage', 1051 params: new routerParams('message') 1052}, router.RouterMode.Standard) 1053 .then(() => { 1054 console.error(`replaceNamedRoute finish`); 1055 }) 1056 .catch((err: ESObject) => { 1057 console.error(`replaceNamedRoute failed, code is ${(err as BusinessError).code}, message is ${(err as BusinessError).message}`); 1058 }) 1059``` 1060 1061## router.replaceNamedRoute<sup>(deprecated)</sup> 1062 1063replaceNamedRoute(options: NamedRouterOptions, mode: RouterMode, callback: AsyncCallback<void>): void 1064 1065Replaces the current page with another one using the named route and destroys the current page. This API uses a promise to return the result. 1066 1067> **NOTE** 1068> 1069> This API is supported since API version 10 and deprecated since API version 18. You are advised to use [replaceNamedRoute](js-apis-arkui-UIContext.md#replacenamedroute-3) instead on the obtained [Router](js-apis-arkui-UIContext.md#router) object. 1070> 1071> Since API version 10, you can use the [getRouter](js-apis-arkui-UIContext.md#getrouter) API in [UIContext](js-apis-arkui-UIContext.md#uicontext) to obtain the [Router](js-apis-arkui-UIContext.md#router) object associated with the current UI context. 1072 1073**Atomic service API**: This API can be used in atomic services since API version 11. 1074 1075**System capability**: SystemCapability.ArkUI.ArkUI.Full 1076 1077**Parameters** 1078 1079| Name | Type | Mandatory | Description | 1080| ------- | ------------------------------- | ---- | ---------- | 1081| options | [NamedRouterOptions](#namedrouteroptions10) | Yes | Description of the new page. | 1082| mode | [RouterMode](#routermode9) | Yes | Routing mode.| 1083| callback | AsyncCallback<void> | Yes | Callback used to return the result. | 1084 1085**Error codes** 1086 1087For details about the error codes, see [Universal Error Codes](../errorcode-universal.md) and [Router Error Codes](errorcode-router.md). 1088> **NOTE** 1089> 1090> The following error codes returned by this API are all of the string type. 1091 1092| ID | Error Message| 1093| --------- | ------- | 1094| 401 | Parameter error. Possible causes: 1. Mandatory parameters are left unspecified; 2.Incorrect parameters types; 3. Parameter verification failed. | 1095| 100001 | The UI execution context is not found. This error code is thrown only in the standard system. | 1096| 100004 | Named route error. The named route does not exist. | 1097 1098**Example** 1099 1100```ts 1101class routerParams { 1102 data1: string; 1103 1104 constructor(str: string) { 1105 this.data1 = str; 1106 } 1107} 1108 1109router.replaceNamedRoute({ 1110 name: 'myPage', 1111 params: new routerParams('message') 1112}, router.RouterMode.Standard, (err) => { 1113 if (err) { 1114 console.error(`replaceNamedRoute failed, code is ${err.code}, message is ${err.message}`); 1115 return; 1116 } 1117 console.info('replaceNamedRoute success'); 1118}); 1119``` 1120 1121## router.back<sup>(deprecated)</sup> 1122 1123back(options?: RouterOptions ): void 1124 1125Returns to the previous page or a specified page, which deletes all pages between the current page and the target page. 1126 1127> **NOTE** 1128> 1129> This API is deprecated since API version 18. You are advised to use [back](js-apis-arkui-UIContext.md#back) instead on the obtained [Router](js-apis-arkui-UIContext.md#router) object. 1130> 1131> Since API version 10, you can use the [getRouter](js-apis-arkui-UIContext.md#getrouter) API in [UIContext](js-apis-arkui-UIContext.md#uicontext) to obtain the [Router](js-apis-arkui-UIContext.md#router) object associated with the current UI context. 1132 1133**Atomic service API**: This API can be used in atomic services since API version 11. 1134 1135**System capability**: SystemCapability.ArkUI.ArkUI.Full 1136 1137**Parameters** 1138 1139| Name | Type | Mandatory| Description | 1140| ------- | ------------------------------- | ---- | ------------------------------------------------------------ | 1141| options | [RouterOptions](#routeroptions) | No | Description of the target page. The **url** parameter indicates the URL of the page to return to. If the specified page does not exist in the navigation stack, no action is taken. If no URL is set, the application returns to the previous page, and the page is not rebuilt. Pages are only reclaimed after being popped from the navigation stack. Setting **url** to the special value **"/"** has no effect. If the named route is used, the provided URL must be the name of the named route.| 1142 1143**Example** 1144 1145```ts 1146this.getUIContext().getRouter().back({ url: 'pages/detail' }); 1147``` 1148 1149## router.back<sup>(deprecated)</sup> 1150 1151back(index: number, params?: Object): void; 1152 1153Returns to the specified page, which deletes all pages between the current page and the target page. 1154 1155> **NOTE** 1156> 1157> This API is supported since API version 12 and deprecated since API version 18. You are advised to use [back](js-apis-arkui-UIContext.md#back12) instead on the obtained [Router](js-apis-arkui-UIContext.md#router) object. 1158> 1159> Since API version 12, you can use the [getRouter](js-apis-arkui-UIContext.md#getrouter) API in [UIContext](js-apis-arkui-UIContext.md#uicontext) to obtain the [Router](js-apis-arkui-UIContext.md#router) object associated with the current UI context. 1160 1161**Atomic service API**: This API can be used in atomic services since API version 12. 1162 1163**System capability**: SystemCapability.ArkUI.ArkUI.Full 1164 1165**Parameters** 1166 1167| Name | Type | Mandatory | Description | 1168| ------- | ------------------------------- | ---- | ---------- | 1169| index | number | Yes | Index of the target page to navigate to. The index starts from 1 from the bottom to the top of the stack.| 1170| params | Object | No | Parameters carried when returning to the page.| 1171 1172**Example** 1173 1174```ts 1175this.getUIContext().getRouter().back(1); 1176``` 1177```ts 1178this.getUIContext().getRouter().back(1, { info: 'From Home' }); // Returning with parameters. 1179``` 1180 1181## router.clear<sup>(deprecated)</sup> 1182 1183clear(): void 1184 1185Clears all historical pages in the stack and retains only the current page at the top of the stack. 1186 1187> **NOTE** 1188> 1189> This API is deprecated since API version 18. You are advised to use [clear](js-apis-arkui-UIContext.md#clear) instead on the obtained [Router](js-apis-arkui-UIContext.md#router) object. 1190> 1191> Since API version 10, you can use the [getRouter](js-apis-arkui-UIContext.md#getrouter) API in [UIContext](js-apis-arkui-UIContext.md#uicontext) to obtain the [Router](js-apis-arkui-UIContext.md#router) object associated with the current UI context. 1192 1193**Atomic service API**: This API can be used in atomic services since API version 11. 1194 1195**System capability**: SystemCapability.ArkUI.ArkUI.Full 1196 1197**Example** 1198 1199```ts 1200this.getUIContext().getRouter().clear(); 1201``` 1202 1203## router.getLength<sup>(deprecated)</sup> 1204 1205getLength(): string 1206 1207Obtains the number of pages in the current stack. 1208 1209> **NOTE** 1210> 1211> This API is deprecated since API version 18. You are advised to use [getLength](js-apis-arkui-UIContext.md#getlength) instead on the obtained [Router](js-apis-arkui-UIContext.md#router) object. 1212> 1213> Since API version 10, you can use the [getRouter](js-apis-arkui-UIContext.md#getrouter) API in [UIContext](js-apis-arkui-UIContext.md#uicontext) to obtain the [Router](js-apis-arkui-UIContext.md#router) object associated with the current UI context. 1214 1215**Atomic service API**: This API can be used in atomic services since API version 11. 1216 1217**System capability**: SystemCapability.ArkUI.ArkUI.Full 1218 1219**Return value** 1220 1221| Type | Description | 1222| ------ | ------------------ | 1223| string | Number of pages in the stack. The maximum value is **32**.| 1224 1225**Example** 1226 1227```ts 1228let size = this.getUIContext().getRouter().getLength(); 1229console.log('pages stack size = ' + size); 1230``` 1231 1232## router.getState<sup>(deprecated)</sup> 1233 1234getState(): RouterState 1235 1236Obtains state information about the page at the top of the navigation stack. 1237 1238> **NOTE** 1239> 1240> This API is deprecated since API version 18. You are advised to use [getState](js-apis-arkui-UIContext.md#getstate) instead on the obtained [Router](js-apis-arkui-UIContext.md#router) object. 1241> 1242> Since API version 10, you can use the [getRouter](js-apis-arkui-UIContext.md#getrouter) API in [UIContext](js-apis-arkui-UIContext.md#uicontext) to obtain the [Router](js-apis-arkui-UIContext.md#router) object associated with the current UI context. 1243 1244**Atomic service API**: This API can be used in atomic services since API version 11. 1245 1246**System capability**: SystemCapability.ArkUI.ArkUI.Full 1247 1248**Return value** 1249 1250| Type | Description | 1251| --------------------------- | ------- | 1252| [RouterState](#routerstate) | Page routing state.| 1253 1254**Example** 1255 1256```ts 1257let page = this.getUIContext().getRouter().getState(); 1258console.log('current index = ' + page.index); 1259console.log('current name = ' + page.name); 1260console.log('current path = ' + page.path); 1261``` 1262 1263## router.getStateByIndex<sup>(deprecated)</sup> 1264 1265getStateByIndex(index: number): RouterState | undefined 1266 1267Obtains the status information about a page by its index. 1268 1269> **NOTE** 1270> 1271> This API is supported since API version 12 and deprecated since API version 18. You are advised to use [getStateByIndex](js-apis-arkui-UIContext.md#getstatebyindex12) instead on the obtained [Router](js-apis-arkui-UIContext.md#router) object. 1272> 1273> Since API version 12, you can use the [getRouter](js-apis-arkui-UIContext.md#getrouter) API in [UIContext](js-apis-arkui-UIContext.md#uicontext) to obtain the [Router](js-apis-arkui-UIContext.md#router) object associated with the current UI context. 1274 1275**Atomic service API**: This API can be used in atomic services since API version 12. 1276 1277**System capability**: SystemCapability.ArkUI.ArkUI.Full 1278 1279**Parameters** 1280 1281| Name | Type | Mandatory | Description | 1282| ------- | ------------------------------- | ---- | ---------- | 1283| index | number | Yes | Index of the target page. The index starts from 1 from the bottom to the top of the stack.| 1284 1285**Return value** 1286 1287| Type | Description | 1288| --------------------------- | ------- | 1289| [RouterState](#routerstate) \| undefined | State information about the target page; **undefined** if the specified index does not exist.| 1290 1291**Example** 1292 1293```ts 1294let options: router.RouterState | undefined = router.getStateByIndex(1); 1295if (options != undefined) { 1296 console.log('index = ' + options.index); 1297 console.log('name = ' + options.name); 1298 console.log('path = ' + options.path); 1299 console.log('params = ' + options.params); 1300} 1301``` 1302## router.getStateByUrl<sup>(deprecated)</sup> 1303 1304getStateByUrl(url: string): Array<RouterState> 1305 1306Obtains the status information about a page by its URL. 1307 1308> **NOTE** 1309> 1310> This API is supported since API version 12 and deprecated since API version 18. You are advised to use [getStateByUrl](js-apis-arkui-UIContext.md#getstatebyurl12) instead on the obtained [Router](js-apis-arkui-UIContext.md#router) object. 1311> 1312> Since API version 12, you can use the [getRouter](js-apis-arkui-UIContext.md#getrouter) API in [UIContext](js-apis-arkui-UIContext.md#uicontext) to obtain the [Router](js-apis-arkui-UIContext.md#router) object associated with the current UI context. 1313 1314**Atomic service API**: This API can be used in atomic services since API version 12. 1315 1316**System capability**: SystemCapability.ArkUI.ArkUI.Full 1317 1318**Parameters** 1319 1320| Name | Type | Mandatory | Description | 1321| ------- | ------------------------------- | ---- | ---------- | 1322| url | string | Yes | URL of the target page. | 1323 1324**Return value** 1325 1326| Type | Description | 1327| --------------------------- | ------- | 1328| Array<[RouterState](#routerstate)> | Page routing state.| 1329 1330**Example** 1331 1332```ts 1333let options: Array<router.RouterState> = router.getStateByUrl('pages/index'); 1334for (let i: number = 0; i < options.length; i++) { 1335 console.log('index = ' + options[i].index); 1336 console.log('name = ' + options[i].name); 1337 console.log('path = ' + options[i].path); 1338 console.log('params = ' + options[i].params); 1339} 1340``` 1341 1342## RouterState 1343 1344Describes the page routing state. 1345 1346**System capability**: SystemCapability.ArkUI.ArkUI.Full 1347 1348| Name | Type | Mandatory| Description | 1349| ----- | ------ | ---- | ------------------------------------------------------------ | 1350| index | number | Yes | Index of the current page in the stack. The index starts from 1 from the bottom to the top of the stack.<br>**Atomic service API**: This API can be used in atomic services since API version 11.| 1351| name | string | Yes | Name of the current page, that is, the file name.<br>**Atomic service API**: This API can be used in atomic services since API version 11.| 1352| path | string | Yes | Path of the current page.<br>**Atomic service API**: This API can be used in atomic services since API version 11.| 1353| params<sup>12+</sup> | Object | Yes | Parameters carried on the current page.<br>**Atomic service API**: This API can be used in atomic services since API version 12. | 1354 1355## router.showAlertBeforeBackPage<sup>(deprecated)</sup> 1356 1357showAlertBeforeBackPage(options: EnableAlertOptions): void 1358 1359Enables the display of a confirm dialog box before returning to the previous page. 1360 1361> **NOTE** 1362> 1363> This API is supported since API version 9 and deprecated since API version 18. You are advised to use [showAlertBeforeBackPage](js-apis-arkui-UIContext.md#showalertbeforebackpage) instead on the obtained [Router](js-apis-arkui-UIContext.md#router) object. 1364> 1365> Since API version 10, you can use the [getRouter](js-apis-arkui-UIContext.md#getrouter) API in [UIContext](js-apis-arkui-UIContext.md#uicontext) to obtain the [Router](js-apis-arkui-UIContext.md#router) object associated with the current UI context. 1366 1367**Atomic service API**: This API can be used in atomic services since API version 11. 1368 1369**System capability**: SystemCapability.ArkUI.ArkUI.Full 1370 1371**Parameters** 1372 1373| Name | Type | Mandatory | Description | 1374| ------- | ---------------------------------------- | ---- | --------- | 1375| options | [EnableAlertOptions](#enablealertoptions) | Yes | Description of the dialog box.| 1376 1377**Error codes** 1378 1379For details about the error codes, see [Universal Error Codes](../errorcode-universal.md) and [Router Error Codes](errorcode-router.md). 1380 1381| ID | Error Message| 1382| --------- | ------- | 1383| 401 | Parameter error. Possible causes: 1. Mandatory parameters are left unspecified; 2.Incorrect parameters types; 3. Parameter verification failed. | 1384| 100001 | Internal error. | 1385 1386**Example** 1387 1388```ts 1389import { BusinessError } from '@kit.BasicServicesKit'; 1390 1391try { 1392 this.getUIContext().getRouter().showAlertBeforeBackPage({ 1393 message: 'Message Info' 1394 }); 1395} catch (err) { 1396 console.error(`showAlertBeforeBackPage failed, code is ${(err as BusinessError).code}, message is ${(err as BusinessError).message}`); 1397} 1398``` 1399## EnableAlertOptions 1400 1401Describes the confirm dialog box. 1402 1403**Atomic service API**: This API can be used in atomic services since API version 11. 1404 1405**System capability**: SystemCapability.ArkUI.ArkUI.Full 1406 1407| Name | Type | Mandatory | Description | 1408| ------- | ------ | ---- | -------- | 1409| message | string | Yes | Content displayed in the confirm dialog box.| 1410 1411## router.hideAlertBeforeBackPage<sup>(deprecated)</sup> 1412 1413hideAlertBeforeBackPage(): void 1414 1415Disables the display of a confirm dialog box before returning to the previous page. 1416 1417> **NOTE** 1418> 1419> This API is supported since API version 9 and deprecated since API version 18. You are advised to use [hideAlertBeforeBackPage](js-apis-arkui-UIContext.md#hidealertbeforebackpage) instead on the obtained [Router](js-apis-arkui-UIContext.md#router) object. 1420> 1421> Since API version 10, you can use the [getRouter](js-apis-arkui-UIContext.md#getrouter) API in [UIContext](js-apis-arkui-UIContext.md#uicontext) to obtain the [Router](js-apis-arkui-UIContext.md#router) object associated with the current UI context. 1422 1423**Atomic service API**: This API can be used in atomic services since API version 11. 1424 1425**System capability**: SystemCapability.ArkUI.ArkUI.Full 1426 1427**Example** 1428 1429```ts 1430this.getUIContext().getRouter().hideAlertBeforeBackPage(); 1431``` 1432 1433## router.getParams<sup>(deprecated)</sup> 1434 1435getParams(): Object 1436 1437Obtains the parameters passed from the page that initiates redirection to the current page. 1438 1439> **NOTE** 1440> 1441> This API is deprecated since API version 18. You are advised to use [getParams](js-apis-arkui-UIContext.md#getparams) instead on the obtained [Router](js-apis-arkui-UIContext.md#router) object. 1442> 1443> Since API version 10, you can use the [getRouter](js-apis-arkui-UIContext.md#getrouter) API in [UIContext](js-apis-arkui-UIContext.md#uicontext) to obtain the [Router](js-apis-arkui-UIContext.md#router) object associated with the current UI context. 1444 1445**Atomic service API**: This API can be used in atomic services since API version 11. 1446 1447**System capability**: SystemCapability.ArkUI.ArkUI.Full 1448 1449**Return value** 1450 1451| Type | Description | 1452| ------ | ---------------------------------- | 1453| object | Parameters passed from the page that initiates redirection to the current page.| 1454 1455**Example** 1456 1457```ts 1458this.getUIContext().getRouter().getParams(); 1459``` 1460 1461## RouterOptions 1462 1463Describes the page routing options. 1464 1465**System capability**: SystemCapability.ArkUI.ArkUI.Lite 1466 1467| Name | Type | Mandatory| Description | 1468| ------ | ------ | ---- | ------------------------------------------------------------ | 1469| url | string | Yes | URL of the target page, in either of the following formats:<br>- Absolute path of the page. The value is available in the pages list in the **config.json** file, for example:<br>- pages/index/index<br>- pages/detail/detail<br>- special value. If the value of url is **"/"**, the application navigates to the home page. By default, the home page is set to the first item in the **src** value array.<br>**Atomic service API**: This API can be used in atomic services since API version 11.| 1470| params | Object | No | Data that needs to be passed to the target page during redirection. The received data becomes invalid when the page is switched to another page. The target page can use **router.getParams()** to obtain the passed parameters, for example, **this.keyValue** (**keyValue** is the value of a key in **params**). In the web-like paradigm, these parameters can be directly used on the target page. If the field specified by **key** already exists on the target page, the passed value of the key will be displayed.<br>**NOTE**<br>The **params** parameter cannot pass objects returned by methods and system APIs, for example, **PixelMap** objects defined and returned by media APIs. To pass such objects, extract from them the basic type attributes to be passed, and then construct objects of the object type.<br>**Atomic service API**: This API can be used in atomic services since API version 11.| 1471| recoverable<sup>14+</sup> | boolean | No | Whether the corresponding page is recoverable.<br>Default value: **true**, indicating that the page is recoverable<br><br>**NOTE**<br> If an application is switched to the background and is later closed by the system due to resource constraints or other reasons, a page marked as recoverable can be restored by the system when the application is brought back to the foreground. For more details, see [UIAbility Backup and Restore](../../application-models/ability-recover-guideline.md).| 1472 1473 > **NOTE** 1474 > The page routing stack supports a maximum of 32 pages. 1475 1476## RouterMode<sup>9+</sup> 1477 1478Enumerates the routing modes. 1479 1480**Atomic service API**: This API can be used in atomic services since API version 11. 1481 1482**System capability**: SystemCapability.ArkUI.ArkUI.Full 1483 1484| Name | Value| Description | 1485| -------- | --- | ------------------------------------------------------------ | 1486| Standard | 0 | Multi-instance mode. It is the default routing mode.<br>The target page is added to the top of the page stack, regardless of whether a page with the same URL exists in the stack.<br>**NOTE**<br>If no routing mode is used, the navigation will be carried out according to the default multi-instance mode.| 1487| Single | 1 | Singleton mode.<br>If the URL of the target page already exists in the page stack, the page is moved to the top of the stack.<br>If the URL of the target page does not exist in the page stack, the page is redirected to in multi-instance mode.| 1488 1489## NamedRouterOptions<sup>10+</sup> 1490 1491Describes the named route options. 1492 1493| Name | Type | Mandatory| Description | 1494| ------ | ------ | ---- | ------------------------------------------------------------ | 1495| name | string | Yes | Name of the target named route.<br>**Atomic service API**: This API can be used in atomic services since API version 11.<br>**System capability**: SystemCapability.ArkUI.ArkUI.Full| 1496| params | Object | No | Data that needs to be passed to the target page during redirection. The target page can use **router.getParams()** to obtain the passed parameters, for example, **this.keyValue** (**keyValue** is the value of a key in **params**). In the web-like paradigm, these parameters can be directly used on the target page. If the field specified by **key** already exists on the target page, the passed value of the key will be displayed.<br>**NOTE**<br>The **params** parameter cannot pass objects returned by methods and system APIs, for example, **PixelMap** objects defined and returned by media APIs. To pass such objects, extract from them the basic type attributes to be passed, and then construct objects of the object type.<br>**Atomic service API**: This API can be used in atomic services since API version 11.<br>**System capability**: SystemCapability.ArkUI.ArkUI.Full | 1497| recoverable<sup>14+</sup> | boolean | No | Whether the corresponding page is recoverable.<br>Default value: **true**, indicating that the page is recoverable<br><br>**NOTE**<br> If an application is switched to the background and is later closed by the system due to resource constraints or other reasons, a page marked as recoverable can be restored by the system when the application is brought back to the foreground. For more details, see [UIAbility Backup and Restore](../../application-models/ability-recover-guideline.md).<br>**System capability**: SystemCapability.ArkUI.ArkUI.Lite| 1498 1499## Examples 1500 1501### JavaScript-based Web-like Development Paradigm 1502 1503The following sample code applies only to JavaScript files, not ArkTS files. 1504 1505<!--code_no_check--> 1506 1507```js 1508// Current page 1509export default { 1510 pushPage() { 1511 router.pushUrl({ 1512 url: 'pages/detail/detail', 1513 params: { 1514 data1: 'message' 1515 } 1516 }); 1517 } 1518} 1519``` 1520<!--code_no_check--> 1521 1522```js 1523// detail page 1524export default { 1525 onInit() { 1526 console.info('showData1:' + this.getUIContext().getRouter().getParams()['data1']); 1527 } 1528} 1529``` 1530 1531### TypeScript-based Declarative Development Paradigm 1532 1533> **NOTE** 1534> 1535> Directly using **router** can lead to [ambiguous instance issues](../../ui/arkts-global-interface.md). To avoid this, obtain a **UIContext** instance using [getUIContext](js-apis-arkui-UIContext.md#uicontext), and then obtain the associated **Router** object using [getRouter](js-apis-arkui-UIContext.md#getrouter). 1536 1537<!--deperecated_code_no_check--> 1538```ts 1539// Navigate to the target page through router.pushUrl with the params parameter carried. 1540import { router } from '@kit.ArkUI'; 1541import { BusinessError } from '@kit.BasicServicesKit' 1542 1543// Define the class for passing parameters. 1544class innerParams { 1545 array: number[]; 1546 1547 constructor(tuple: number[]) { 1548 this.array = tuple; 1549 } 1550} 1551 1552class routerParams { 1553 text: string; 1554 data: innerParams; 1555 1556 constructor(str: string, tuple: number[]) { 1557 this.text = str; 1558 this.data = new innerParams(tuple); 1559 } 1560} 1561 1562@Entry 1563@Component 1564struct Index { 1565 async routePage() { 1566 let options: router.RouterOptions = { 1567 url: 'pages/second', 1568 params: new routerParams('This is the value on the first page', [12, 45, 78]) 1569 } 1570 // You are advised to use this.getUIContext().getRouter().pushUrl(). 1571 router.pushUrl(options) 1572 .then(() => { 1573 console.error(`pushUrl finish`); 1574 }) 1575 .catch((err: ESObject) => { 1576 console.error(`pushUrl failed, code is ${(err as BusinessError).code}, message is ${(err as BusinessError).message}`); 1577 }) 1578 } 1579 1580 build() { 1581 Flex({ direction: FlexDirection.Column, alignItems: ItemAlign.Center, justifyContent: FlexAlign.Center }) { 1582 Text('This is the first page.') 1583 .fontSize(50) 1584 .fontWeight(FontWeight.Bold) 1585 Button() { 1586 Text('next page') 1587 .fontSize(25) 1588 .fontWeight(FontWeight.Bold) 1589 }.type(ButtonType.Capsule) 1590 .margin({ top: 20 }) 1591 .backgroundColor('#ccc') 1592 .onClick(() => { 1593 this.routePage() 1594 }) 1595 } 1596 .width('100%') 1597 .height('100%') 1598 } 1599} 1600``` 1601 1602```ts 1603// Receive the transferred parameters on the second page. 1604import { router } from '@kit.ArkUI'; 1605 1606class innerParams { 1607 array: number[]; 1608 1609 constructor(tuple: number[]) { 1610 this.array = tuple; 1611 } 1612} 1613 1614class routerParams { 1615 text: string; 1616 data: innerParams; 1617 1618 constructor(str: string, tuple: number[]) { 1619 this.text = str; 1620 this.data = new innerParams(tuple); 1621 } 1622} 1623 1624@Entry 1625@Component 1626struct Second { 1627 private content: string = "This is the second page."; 1628 // You are advised to use this.getUIContext().getRouter().getParams(). 1629 @State text: string = (this.getUIContext().getRouter().getParams() as routerParams).text; 1630 @State data: object = (this.getUIContext().getRouter().getParams() as routerParams).data; 1631 @State secondData: string = ''; 1632 1633 build() { 1634 Flex({ direction: FlexDirection.Column, alignItems: ItemAlign.Center, justifyContent: FlexAlign.Center }) { 1635 Text(`${this.content}`) 1636 .fontSize(50) 1637 .fontWeight(FontWeight.Bold) 1638 Text(this.text) 1639 .fontSize(30) 1640 .onClick(() => { 1641 this.secondData = (this.data['array'][1]).toString(); 1642 }) 1643 .margin({ top: 20 }) 1644 Text(`This is the data passed from the first page: ${this.secondData}`) 1645 .fontSize(20) 1646 .margin({ top: 20 }) 1647 .backgroundColor('red') 1648 } 1649 .width('100%') 1650 .height('100%') 1651 } 1652} 1653``` 1654 1655## router.push<sup>(deprecated)</sup> 1656 1657push(options: RouterOptions): void 1658 1659Navigates to a specified page in the application. 1660 1661This API is deprecated since API version 9. You are advised to use [pushUrl](js-apis-arkui-UIContext.md#pushurl) instead. 1662 1663**System capability**: SystemCapability.ArkUI.ArkUI.Full 1664 1665**Parameters** 1666 1667| Name | Type | Mandatory | Description | 1668| ------- | ------------------------------- | ---- | --------- | 1669| options | [RouterOptions](#routeroptions) | Yes | Page routing parameters.| 1670 1671 1672**Example** 1673 1674```ts 1675class innerParams { 1676 data3: number[]; 1677 1678 constructor(tuple: number[]) { 1679 this.data3 = tuple; 1680 } 1681} 1682 1683class routerParams { 1684 data1: string; 1685 data2: innerParams; 1686 1687 constructor(str: string, tuple: number[]) { 1688 this.data1 = str; 1689 this.data2 = new innerParams(tuple); 1690 } 1691} 1692 1693router.push({ 1694 url: 'pages/routerpage2', 1695 params: new routerParams('message', [123, 456, 789]) 1696}); 1697``` 1698 1699## router.replace<sup>(deprecated)</sup> 1700 1701replace(options: RouterOptions): void 1702 1703Replaces the current page with another one in the application and destroys the current page. 1704 1705This API is deprecated since API version 9. You are advised to use [replaceUrl](js-apis-arkui-UIContext.md#replaceurl) instead. 1706 1707**System capability**: SystemCapability.ArkUI.ArkUI.Lite 1708 1709**Parameters** 1710 1711| Name | Type | Mandatory| Description | 1712| ------- | ------------------------------- | ---- | ------------------ | 1713| options | [RouterOptions](#routeroptions) | Yes | Description of the new page.| 1714 1715**Example** 1716 1717```ts 1718class routerParams { 1719 data1: string; 1720 1721 constructor(str: string) { 1722 this.data1 = str; 1723 } 1724} 1725 1726router.replace({ 1727 url: 'pages/detail', 1728 params: new routerParams('message') 1729}); 1730``` 1731 1732## router.enableAlertBeforeBackPage<sup>(deprecated)</sup> 1733 1734enableAlertBeforeBackPage(options: EnableAlertOptions): void 1735 1736Enables the display of a confirm dialog box before returning to the previous page. 1737 1738This API is deprecated since API version 9. You are advised to use [showAlertBeforeBackPage](js-apis-arkui-UIContext.md#showalertbeforebackpage) instead. 1739 1740**System capability**: SystemCapability.ArkUI.ArkUI.Full 1741 1742**Parameters** 1743 1744| Name | Type | Mandatory | Description | 1745| ------- | ---------------------------------------- | ---- | --------- | 1746| options | [EnableAlertOptions](#enablealertoptions) | Yes | Description of the dialog box.| 1747 1748**Example** 1749 1750```ts 1751router.enableAlertBeforeBackPage({ 1752 message: 'Message Info' 1753}); 1754``` 1755 1756## router.disableAlertBeforeBackPage<sup>(deprecated)</sup> 1757 1758disableAlertBeforeBackPage(): void 1759 1760Disables the display of a confirm dialog box before returning to the previous page. 1761 1762This API is deprecated since API version 9. You are advised to use [hideAlertBeforeBackPage](js-apis-arkui-UIContext.md#hidealertbeforebackpage) instead. 1763 1764**System capability**: SystemCapability.ArkUI.ArkUI.Full 1765 1766**Example** 1767 1768```ts 1769router.disableAlertBeforeBackPage(); 1770``` 1771