NavDestination
<NavDestination> is the root container of a destination page and represents the content area of the <Navigation> component.
NOTE
This component is supported since API version 9. Updates will be marked with a superscript to indicate their earliest API version.
Child Components
Supported types of child components: built-in components and custom components, with support for (if/else, ForEach, and LazyForEach) rendering control.
Number of child components: multiple.
APIs
NavDestination()
Attributes
In addition to the backgroundColor attribute, the following attributes are supported.
Name | Type | Description |
---|---|---|
title | string | CustomBuilder | NavigationCommonTitle | NavigationCustomTitle | Page title. NOTE When the NavigationCustomTitle type is used to set the height, the titleMode attribute does not take effect. When the title string is too long: (1) If no subtitle is set, the string is scaled down, wrapped in two lines, and then clipped with an ellipsis (...). (2) If a subtitle is set, the subtitle is scaled down and then clipped with an ellipsis (...). |
hideTitleBar | boolean | Whether to hide the title bar. Default value: false true: Hide the title bar. false: Display the title bar. |
Events
In addition to the universal events, the following events are supported.
Name | Description |
---|---|
onShown(callback: () => void)10+ | Called when the navigation destination page is displayed. |
onHidden(callback: () => void)10+ | Called when the navigation destination page is hidden. |
onBackPressed(callback: () => boolean)10+ | Called when the back button is pressed. This callback takes effect when there is one or more entries in the navigation stack bound to the <Navigation> component. The value true means that the back button logic is overridden, and false means that the previous page is displayed. |
Example
Since API version 9, see NavRouter Example.
Since API version 10, see NavPathStack Example.