1# Custom Component Built-in APIs
2
3Custom component built-in APIs are APIs predefined on the base class of custom components in the ArkUI framework. You can call these APIs on the instance of a custom component to obtain information, such as the UI context, about the instance.
4
5> **NOTE**
6>
7> The initial APIs of this module are supported since API version 11. Newly added APIs will be marked with a superscript to indicate their earliest API version.
8>
9
10## getUIContext
11
12getUIContext(): UIContext
13
14Obtains the **UIContext** instance.
15
16**Atomic service API**: This API can be used in atomic services since API version 12.
17
18**System capability**: SystemCapability.ArkUI.ArkUI.Full
19
20**Return value**
21
22| Type                                                     | Description                   |
23| --------------------------------------------------------- | ----------------------- |
24| [UIContext](../js-apis-arkui-UIContext.md#uicontext) | **UIContext** instance obtained. |
25
26**Example**
27
28```ts
29import { UIContext } from '@kit.ArkUI';
30
31@Entry
32@Component
33struct MyComponent {
34  aboutToAppear() {
35    let uiContext: UIContext = this.getUIContext();
36  }
37
38  build() {
39    // ...
40  }
41}
42```
43
44## getUniqueId<sup>12+</sup>
45
46getUniqueId(): number
47
48Obtains the unique ID of this component. This unique ID is assigned by the system to each component. If this API is called before the component's corresponding node is created or after it has been destroyed, an invalid unique ID, which is **-1**, will be returned.
49
50**Atomic service API**: This API can be used in atomic services since API version 12.
51
52**System capability**: SystemCapability.ArkUI.ArkUI.Full
53
54**Return value**
55
56| Type                                                     | Description                   |
57| --------------------------------------------------------- | ----------------------- |
58| number | Unique ID of the current Component. |
59
60**Example**
61
62```ts
63@Entry
64@Component
65struct MyComponent {
66  aboutToAppear() {
67    let uniqueId: number = this.getUniqueId();
68  }
69
70  build() {
71    // ...
72  }
73}
74```
75
76## queryNavDestinationInfo
77
78queryNavDestinationInfo(): NavDestinationInfo | undefined;
79
80Queries the **NavDestination** information of this custom component.
81
82**Atomic service API**: This API can be used in atomic services since API version 12.
83
84**System capability**: SystemCapability.ArkUI.ArkUI.Full
85
86**Return value**
87
88| Type                                                                      | Description     |
89| -------------------------------------------------------------------------- | --------- |
90| [NavDestinationInfo](../js-apis-arkui-observer.md#navdestinationinfo) \| undefined | **NavDestinationInfo** instance obtained. |
91
92**Example**
93
94```ts
95import { uiObserver } from '@kit.ArkUI'
96
97@Component
98export struct NavDestinationExample {
99  build() {
100    NavDestination() {
101      MyComponent()
102    }
103  }
104}
105
106@Component
107struct MyComponent {
108  navDesInfo: uiObserver.NavDestinationInfo | undefined
109
110  aboutToAppear() {
111    // this refers to the custom node MyComponent and searches for the nearest parent node of the NavDestination type from this node upwards.
112    this.navDesInfo = this.queryNavDestinationInfo();
113    console.log('get navDestinationInfo: ' + JSON.stringify(this.navDesInfo))
114  }
115
116  build() {
117    // ...
118  }
119}
120```
121
122## queryNavigationInfo<sup>12+</sup>
123
124queryNavigationInfo(): NavigationInfo | undefined
125
126Queries the **Navigation** information of this custom component.
127
128**Atomic service API**: This API can be used in atomic services since API version 12.
129
130**System capability**: SystemCapability.ArkUI.ArkUI.Full
131
132**Return value**
133
134| Type                                                                      | Description     |
135| -------------------------------------------------------------------------- | --------- |
136| [NavigationInfo](../js-apis-arkui-observer.md#navigationinfo12) \| undefined | **NavigationInfo** instance obtained. |
137
138**Example**
139
140```ts
141// index.ets
142import { uiObserver } from '@kit.ArkUI'
143
144@Entry
145@Component
146struct MainPage {
147  pathStack: NavPathStack = new NavPathStack()
148
149  build() {
150    Navigation(this.pathStack) {
151      // ...
152    }.id("NavigationId")
153  }
154}
155
156
157@Component
158export struct PageOne {
159  pathStack: NavPathStack = new NavPathStack()
160
161  aboutToAppear() {
162    // this refers to the custom node PageOne and searches for the nearest parent node of the Navigation type from this node upwards.
163    let navigationInfo: uiObserver.NavigationInfo | undefined = this.queryNavigationInfo()
164    console.log('get navigationInfo: ' + JSON.stringify(navigationInfo))
165    if (navigationInfo !== undefined) {
166      this.pathStack = navigationInfo.pathStack
167    }
168  }
169
170  build() {
171    NavDestination() {
172      // ...
173    }.title('PageOne')
174  }
175}
176```
177
178## queryRouterPageInfo<sup>12+</sup>
179
180queryRouterPageInfo(): RouterPageInfo | undefined;
181
182Obtains a **RouterPageInfo** instance.
183
184**Atomic service API**: This API can be used in atomic services since API version 12.
185
186**System capability**: SystemCapability.ArkUI.ArkUI.Full
187
188**Return value**
189
190| Type                                                        | Description                        |
191| ------------------------------------------------------------ | ---------------------------- |
192| [RouterPageInfo](../js-apis-arkui-observer.md#routerpageinfo) \| undefined | **RouterPageInfo** instance obtained. |
193
194**Example**
195
196```ts
197import { uiObserver } from '@kit.ArkUI'
198
199@Entry
200@Component
201struct MyComponent {
202  aboutToAppear() {
203    let info: uiObserver.RouterPageInfo | undefined = this.queryRouterPageInfo();
204  }
205
206  build() {
207    // ...
208  }
209}
210```
211