• Home
  • Line#
  • Scopes#
  • Navigate#
  • Raw
  • Download
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&lt;void&gt;
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&lt;void&gt; | 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&lt;void&gt;): 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&lt;void&gt;      | 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&lt;void&gt;
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&lt;void&gt; | 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&lt;void&gt;): 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&lt;void&gt;      | 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&lt;void&gt;
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&lt;void&gt; | 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&lt;void&gt;): 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&lt;void&gt;      | 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&lt;void&gt;
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&lt;void&gt; | 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&lt;void&gt;): 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&lt;void&gt;      | 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&lt;void&gt;
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&lt;void&gt; | 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&lt;void&gt;): 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&lt;void&gt;      | 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&lt;void&gt;
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&lt;void&gt; | 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&lt;void&gt;): 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&lt;void&gt;      | 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&lt;void&gt;
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&lt;void&gt; | 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&lt;void&gt;): 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&lt;void&gt;      | 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&lt;void&gt;
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&lt;void&gt; | 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&lt;void&gt;): 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&lt;void&gt;      | 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&lt;RouterState&gt;
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